:root {
  color-scheme: light;
  font-family: "Microsoft YaHei UI", "PingFang SC", sans-serif;
  --ink: #182220;
  --muted: #71807a;
  --line: #dfe7e3;
  --surface: #ffffff;
  --canvas: #f5f7f6;
  --accent: #0d796e;
  --accent-strong: #086b61;
  --accent-soft: #e7f6f1;
  --coral: #0d796e;
  --coral-strong: #086b61;
  --coral-soft: #e7f6f1;
  --warm: #c59439;
  --danger: #bd4f55;
  --shadow: 0 18px 50px rgba(29, 49, 43, 0.14);
}

/* h75: compact strategy key-level zones with the intraday plan and risk scale. */
.market-intraday-plan {
  margin: 8px 10px 6px;
  padding: 9px 10px;
  border: 1px solid #d8e9e3;
  border-radius: 7px;
  background: #f2f9f6;
}
.market-intraday-plan header,
.market-intraday-plan footer,
.market-zone-current,
.market-risk-labels,
.market-risk-scale footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.market-intraday-plan header { color: #176c61; font-size: 11px; font-weight: 700; }
.market-intraday-plan header em { padding: 2px 7px; border-radius: 999px; color: #177d77; background: #dcefe8; font-size: 9px; font-style: normal; }
.market-intraday-plan header em.tone-short { color: #b44e58; background: #f8e6e5; }
.market-intraday-plan header em.tone-neutral { color: #8a691d; background: #f6edd6; }
.market-intraday-plan p { margin: 6px 0 5px; color: #384642; font-size: 11px; line-height: 1.45; }
.market-intraday-plan p b { color: #177d77; }
.market-intraday-plan footer { color: #73807c; font-size: 9px; }
.market-intraday-plan.is-empty { border-color: #e4e9e7; background: #fafcfa; }
.market-intraday-plan.is-empty header { color: #626f6b; }
.market-intraday-plan.is-empty p { margin-bottom: 0; color: #7d8884; }
.market-level-axis {
  height: auto;
  min-height: 0;
  overflow: visible;
  padding: 0 10px 10px;
  background: #fff;
}
.market-level-axis::before,
.market-level-axis::after { display: none; }
.market-zone-current {
  min-height: 42px;
  margin-bottom: 7px;
  padding: 7px 10px;
  border: 1px solid #cce5df;
  border-radius: 7px;
  color: #155f57;
  background: #eef8f5;
}
.market-zone-current span { display: grid; gap: 2px; min-width: 0; }
.market-zone-current small { color: #5f817a; font-size: 9px; }
.market-zone-current b { font-size: 11px; }
.market-zone-current > strong { color: #176c61; font-size: 18px; font-variant-numeric: tabular-nums; }
.market-zone-bands { display: grid; gap: 5px; }
.market-zone-band {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 2px 8px;
  min-height: 48px;
  padding: 7px 9px;
  border-left: 3px solid #c84e57;
  border-radius: 5px;
  background: #f7f9f8;
}
.market-zone-band.tone-pivot { border-left-color: #b07a18; }
.market-zone-band.tone-support { border-left-color: #238b68; }
.market-zone-band.is-current { border: 1px solid #2d9984; border-left-width: 3px; color: #0f6559; background: #e7f5ef; }
.market-zone-name { overflow: hidden; color: #66716d; font-size: 10px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.market-zone-band > strong { color: #3e4b47; font-size: 11px; font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.market-zone-band > small { overflow: hidden; grid-column: 1 / -1; color: #7d8984; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.market-zone-band.is-current > small { color: #2d776b; }
.market-zone-markers { display: flex; grid-column: 1 / -1; flex-wrap: wrap; gap: 4px 10px; padding-top: 4px; border-top: 1px solid rgba(88, 110, 103, .12); }
.market-zone-markers span { display: inline-flex; align-items: baseline; gap: 4px; color: #296fba; font-size: 9px; font-variant-numeric: tabular-nums; }
.market-zone-markers span.tone-entry { color: #956d14; }
.market-zone-markers span.tone-stop { color: #b54951; }
.market-zone-markers span.tone-exit { color: #576b9a; }
.market-zone-markers b { font-size: 9px; }
.market-risk-scale { margin-top: 9px; padding-top: 8px; border-top: 1px solid #edf0ef; }
.market-risk-scale.is-empty { display: flex; justify-content: space-between; color: #7d8884; font-size: 10px; }
.market-risk-scale.is-empty small { color: #9aa39f; }
.market-risk-labels { color: #6f7c77; font-size: 9px; font-variant-numeric: tabular-nums; }
.market-risk-labels b { color: #956d14; font-size: 10px; }
.market-risk-track { display: flex; height: 7px; margin: 6px 0; overflow: hidden; border-radius: 999px; background: #2d9a82; }
.market-risk-track i { display: block; flex: 0 0 auto; background: #d66b68; }
.market-risk-track b { display: block; flex: 1; }
.market-risk-scale footer { color: #74807b; font-size: 9px; font-variant-numeric: tabular-nums; }
.market-risk-scale footer strong { color: #177d77; font-size: 10px; }
html[data-theme="dark"] .market-intraday-plan { border-color: #2d5147; background: #18312b; }
html[data-theme="dark"] .market-intraday-plan header,
html[data-theme="dark"] .market-intraday-plan p b { color: #a5dfce; }
html[data-theme="dark"] .market-intraday-plan p { color: #d5e1dc; }
html[data-theme="dark"] .market-intraday-plan footer { color: #9eb6ae; }
html[data-theme="dark"] .market-intraday-plan.is-empty { border-color: #303734; background: #252b29; }
html[data-theme="dark"] .market-level-axis { background: #202522; }
html[data-theme="dark"] .market-zone-current { border-color: #2e5e54; color: #b9e0d7; background: #1b3932; }
html[data-theme="dark"] .market-zone-current small,
html[data-theme="dark"] .market-zone-current > strong { color: #9ed9c9; }
html[data-theme="dark"] .market-zone-band { background: #292f2c; }
html[data-theme="dark"] .market-zone-band.is-current { border-color: #4aa88f; color: #c2eddf; background: #1b3932; }
html[data-theme="dark"] .market-zone-name,
html[data-theme="dark"] .market-zone-band > small { color: #9ca9a4; }
html[data-theme="dark"] .market-zone-band > strong { color: #e2e9e6; }
html[data-theme="dark"] .market-zone-band.is-current > small { color: #a5dfce; }
html[data-theme="dark"] .market-risk-scale { border-color: #303734; }
html[data-theme="dark"] .market-risk-labels,
html[data-theme="dark"] .market-risk-scale footer { color: #9aa9a3; }
@media (max-width: 520px) {
  .market-level-axis { padding: 0 8px 9px; }
  .market-intraday-plan { margin-inline: 8px; }
  .market-zone-band { min-height: 44px; padding: 6px 8px; }
  .market-zone-band > strong { font-size: 10px; }
  .market-zone-markers { gap: 3px 8px; }
  .market-risk-scale footer { gap: 5px; }
  .market-risk-scale footer strong { font-size: 9px; }
}

/* h76: one-screen mobile market and stable one-second quote updates. */
.market-live-price,
.analysis-group-quote-copy strong,
#marketZoneCurrentPrice { min-width: 7ch; font-variant-numeric: tabular-nums; }

@media (max-width: 760px) {
  .jin10-content.market-single-screen {
    overflow: hidden;
    padding: 0;
  }
  .market-single-screen .gold-market-overview {
    display: grid;
    width: 100%;
    height: 100%;
    min-height: 0;
    grid-template-rows: auto minmax(0, 1fr);
    margin: 0;
    padding: 0;
    overflow: hidden;
  }
  .market-single-screen .market-quote-board {
    padding: 6px 10px 5px;
  }
  .market-single-screen .market-quote-board > header {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }
  .market-single-screen .market-symbol-title { gap: 5px; }
  .market-single-screen .market-symbol-title strong { font-size: 14px; }
  .market-single-screen .market-symbol-title span { font-size: 11px; }
  .market-single-screen .market-symbol-title svg { display: none; }
  .market-single-screen .market-symbol-meta { justify-content: flex-end; gap: 4px; font-size: 8px; }
  .market-single-screen .market-symbol-meta em,
  .market-single-screen .market-symbol-meta span { padding: 2px 4px; }
  .market-single-screen .market-quote-summary {
    grid-template-columns: 104px minmax(0, 1fr);
    gap: 8px;
    margin-top: 5px;
  }
  .market-single-screen .market-quote-primary .market-live-price { font-size: 24px; }
  .market-single-screen .market-quote-primary > span { margin-top: 3px; font-size: 9px; }
  .market-single-screen .market-quote-matrix { gap: 3px 8px; }
  .market-single-screen .market-quote-matrix > div { gap: 4px; }
  .market-single-screen .market-quote-matrix span { font-size: 8px; }
  .market-single-screen .market-quote-matrix strong { font-size: 10px; }
  .market-single-screen .market-quote-board > footer {
    margin-top: 4px;
    padding-top: 3px;
    font-size: 8px;
  }
  .market-single-screen .market-quote-board > footer strong { font-size: 8px; }
  .market-single-screen .market-level-section {
    display: flex;
    min-height: 0;
    flex-direction: column;
    margin-top: 0;
    overflow: hidden;
  }
  .market-single-screen .market-level-section > header {
    min-height: 34px;
    padding: 3px 8px;
  }
  .market-single-screen .market-level-section > header strong { font-size: 12px; }
  .market-single-screen .market-level-section > header small { margin-top: 0; font-size: 8px; }
  .market-single-screen .market-level-section > header button { width: 28px; height: 28px; }
  .market-single-screen .market-intraday-plan {
    min-height: 45px;
    margin: 4px 8px;
    padding: 5px 7px;
  }
  .market-single-screen .market-intraday-plan header { font-size: 9px; }
  .market-single-screen .market-intraday-plan p { overflow: hidden; margin: 3px 0 2px; font-size: 9px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
  .market-single-screen .market-intraday-plan footer { font-size: 8px; }
  .market-single-screen .market-level-axis {
    display: flex;
    min-height: 0;
    flex: 1;
    flex-direction: column;
    padding: 0 8px 4px;
    overflow: hidden;
  }
  .market-single-screen .market-zone-current {
    min-height: 31px;
    margin-bottom: 4px;
    padding: 3px 7px;
  }
  .market-single-screen .market-zone-current small { font-size: 7px; }
  .market-single-screen .market-zone-current b { font-size: 9px; }
  .market-single-screen .market-zone-current > strong { font-size: 15px; }
  .market-single-screen .market-zone-bands {
    display: grid;
    min-height: 0;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 3px;
  }
  .market-single-screen .market-zone-band {
    display: flex;
    min-width: 0;
    min-height: 54px;
    align-items: stretch;
    justify-content: center;
    flex-direction: column;
    gap: 1px;
    padding: 3px 5px;
  }
  .market-single-screen .market-zone-name { font-size: 8px; }
  .market-single-screen .market-zone-band > strong {
    overflow: hidden;
    font-size: 9px;
    text-align: left;
    text-overflow: ellipsis;
  }
  .market-single-screen .market-zone-band > small { display: none; }
  .market-single-screen .market-zone-band.is-current > small {
    display: block;
    overflow: hidden;
    font-size: 7px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .market-single-screen .market-zone-markers {
    display: flex;
    overflow: hidden;
    flex-wrap: nowrap;
    gap: 4px;
    padding-top: 2px;
    white-space: nowrap;
  }
  .market-single-screen .market-zone-markers span,
  .market-single-screen .market-zone-markers b { font-size: 7px; }
  .market-single-screen .market-risk-scale {
    margin-top: 4px;
    padding-top: 4px;
  }
  .market-single-screen .market-risk-labels,
  .market-single-screen .market-risk-scale footer { font-size: 7px; }
  .market-single-screen .market-risk-labels b,
  .market-single-screen .market-risk-scale footer strong { font-size: 8px; }
  .market-single-screen .market-risk-track { height: 5px; margin: 3px 0; }
  .market-single-screen .market-level-section > footer {
    min-height: 24px;
    gap: 6px;
    padding: 3px 8px;
    font-size: 7px;
  }
  .market-single-screen .market-level-section > footer small { max-width: 120px; font-size: 7px; }
}

@media (max-width: 350px) {
  .market-single-screen .market-symbol-meta time,
  .market-single-screen .market-level-section > header small,
  .market-single-screen .market-level-section > footer small { display: none; }
  .market-single-screen .market-quote-summary { grid-template-columns: 94px minmax(0, 1fr); }
  .market-single-screen .market-quote-primary .market-live-price { font-size: 21px; }
  .market-single-screen .market-zone-band { min-height: 50px; padding-inline: 4px; }
}

/* h53: complete landscape chart and report moderation actions. */
.delivery-state.queued {
  color: #9a732b;
}

.monthly-review-toolbar {
  display: flex;
  gap: 8px;
  padding: 0 18px 14px;
}

.monthly-review-toolbar input { flex: 1; min-height: 40px; }
.monthly-review-content { display: grid; gap: 14px; padding: 0 18px 18px; }
.monthly-review-summary { padding: 14px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); }
.monthly-review-summary > header { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.monthly-review-summary > header div { display: grid; gap: 3px; }
.monthly-review-summary > header span { color: var(--muted); font-size: 11px; }
.monthly-review-summary > header b { font-size: 16px; }
.monthly-review-summary .profit, .monthly-review-notes .profit { color: #bd4f55; }
.monthly-review-summary .loss, .monthly-review-notes .loss { color: #16846f; }
.monthly-review-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; margin: 14px 0; }
.monthly-review-grid div { display: grid; gap: 3px; padding: 9px; border: 1px solid var(--line); border-radius: 6px; }
.monthly-review-grid span { color: var(--muted); font-size: 10px; }
.monthly-review-grid strong { font-size: 15px; }
.monthly-review-summary > footer { display: flex; flex-wrap: wrap; gap: 8px 14px; color: var(--muted); font-size: 11px; }
.monthly-review-notes { display: grid; gap: 1px; }
.monthly-review-notes > header { display: flex; justify-content: space-between; padding: 0 2px 8px; }
.monthly-review-notes article { min-height: 54px; display: grid; grid-template-columns: 68px 1fr auto; align-items: center; gap: 8px; border-bottom: 1px solid var(--line); }
.monthly-review-notes article > span { display: grid; gap: 2px; }
.monthly-review-notes time, .monthly-review-notes small { color: var(--muted); font-size: 10px; }

.admin-reports-section { display: grid; gap: 10px; margin: 0 18px 18px; padding-top: 14px; border-top: 1px solid var(--line); }
.admin-reports-section > header { display: grid; gap: 3px; }
.admin-reports-section > header > div { display: flex; justify-content: space-between; gap: 10px; }
.admin-reports-section > header span, .admin-reports-section > header small { color: var(--muted); font-size: 11px; }
.admin-reports-list { display: grid; gap: 8px; }
.admin-report-row { display: grid; gap: 7px; padding: 11px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); }
.admin-report-row > header { display: flex; justify-content: space-between; gap: 10px; }
.admin-report-row > header span { display: grid; gap: 2px; }
.admin-report-row > header small, .admin-report-row > small { color: var(--muted); font-size: 10px; }
.admin-report-row > header b { color: #9a732b; font-size: 11px; }
.admin-report-row p { margin: 0; line-height: 1.55; overflow-wrap: anywhere; }
.admin-report-row footer { display: flex; justify-content: flex-end; gap: 7px; }
.admin-report-row footer button { min-height: 32px; padding: 0 10px; }
.admin-report-row.status-resolved, .admin-report-row.status-dismissed { opacity: .68; }

/* h51: chart tools, strategy risk scale, price alerts, and admin operations. */
.market-chart-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 5px;
  margin-left: auto;
}

.market-chart-actions button {
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--ink);
  background: var(--surface);
}

.market-chart-actions svg { width: 15px; height: 15px; }

body.market-chart-fullscreen { overflow: hidden; }

.jin10-pane.market-fullscreen {
  position: fixed !important;
  inset: 0 !important;
  z-index: 140 !important;
  width: 100vw !important;
  height: var(--app-height, 100dvh) !important;
  max-width: none !important;
  background: var(--canvas);
}

.jin10-pane.market-fullscreen .jin10-header,
.jin10-pane.market-fullscreen .jin10-tabs,
.jin10-pane.market-fullscreen .market-quote-board,
.jin10-pane.market-fullscreen .gold-market-overview > .market-section-shortcuts,
.jin10-pane.market-fullscreen .market-chart-section > p { display: none !important; }

.jin10-pane.market-fullscreen .jin10-content,
.jin10-pane.market-fullscreen .gold-market-overview,
.jin10-pane.market-fullscreen .market-chart-section { height: 100% !important; min-height: 0 !important; }

.jin10-pane.market-fullscreen .market-chart-section {
  display: flex;
  flex-direction: column;
  padding: 8px;
}

.jin10-pane.market-fullscreen .market-chart-stage,
.jin10-pane.market-fullscreen .market-chart-stage .market-chart {
  height: auto !important;
  min-height: 0 !important;
  flex: 1 1 auto;
}

.price-alert-form {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 8px;
  padding: 0 18px 12px;
  align-items: end;
}

.price-alert-form label { display: grid; gap: 5px; color: var(--muted); font-size: 12px; }
.price-alert-form input, .price-alert-form select { width: 100%; min-height: 40px; }
.price-alert-form .primary-button { min-height: 40px; white-space: nowrap; }
.price-alert-help { margin: 0 18px 12px; color: var(--muted); font-size: 11px; }
.price-alert-list { display: grid; gap: 1px; padding: 0 18px 18px; }
.price-alert-row { min-height: 60px; display: grid; grid-template-columns: 34px 1fr 32px; align-items: center; gap: 9px; border-bottom: 1px solid var(--line); }
.price-alert-row .price-alert-icon { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; color: var(--accent); background: var(--accent-soft); }
.price-alert-row.triggered { opacity: .65; }
.price-alert-row span:nth-child(2) { display: grid; gap: 2px; }
.price-alert-row strong { font-size: 16px; }
.price-alert-row small { color: var(--muted); }

.strategy-price-scale { margin: 12px 0; padding: 12px; border: 1px solid var(--line); border-radius: 7px; background: color-mix(in srgb, var(--surface) 92%, var(--canvas)); }
.strategy-price-scale > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.strategy-price-scale > header div { display: grid; gap: 2px; }
.strategy-price-scale > header span { color: var(--muted); font-size: 11px; }
.strategy-price-scale > header b { color: var(--accent); font-size: 12px; }
.strategy-price-track { position: relative; height: 230px; margin: 10px 6px; border-left: 2px solid var(--line); }
.strategy-price-marker { position: absolute; left: -5px; right: 0; height: 0; display: grid; grid-template-columns: 58px 1fr 72px; align-items: center; gap: 6px; color: var(--muted); font-size: 10px; }
.strategy-price-marker i { height: 1px; background: var(--line); }
.strategy-price-marker::before { content: ""; position: absolute; left: 0; width: 8px; height: 8px; border: 2px solid var(--surface); border-radius: 50%; background: var(--muted); transform: translate(-5px,-4px); }
.strategy-price-marker span { padding-left: 9px; }
.strategy-price-marker strong { color: var(--ink); text-align: right; font-size: 12px; }
.strategy-price-marker.tone-target::before { background: #d6535d; }
.strategy-price-marker.tone-entry::before { background: #d29b35; }
.strategy-price-marker.tone-stop::before { background: #35a779; }
.strategy-price-marker.tone-current { z-index: 2; font-weight: 700; }
.strategy-price-marker.tone-current i { height: 2px; background: var(--accent); }
.strategy-price-marker.tone-current::before { width: 10px; height: 10px; background: var(--accent); transform: translate(-6px,-5px); }
.strategy-price-scale > footer { display: flex; justify-content: space-between; gap: 10px; padding-top: 8px; border-top: 1px solid var(--line); color: var(--muted); font-size: 11px; }
.strategy-note-button { width: 100%; min-height: 40px; margin: 10px 0; }
.strategy-audit-changes { display: grid !important; gap: 6px; width: 100%; }
.strategy-audit-change { display: grid; grid-template-columns: 52px 1fr 16px 1fr; align-items: center; gap: 5px; }
.strategy-audit-change small { color: var(--muted); }
.strategy-audit-change b { color: var(--muted); font-weight: 500; }
.strategy-audit-change strong { color: var(--ink); }
.strategy-audit-change svg { width: 13px; height: 13px; }

.favorite-category-tabs { display: flex; gap: 6px; padding: 0 18px 12px; overflow-x: auto; }
.favorite-category-tabs button { min-height: 31px; padding: 0 12px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); background: var(--surface); white-space: nowrap; }
.favorite-category-tabs button.active { color: var(--accent-strong); border-color: var(--accent); background: var(--accent-soft); }
.favorite-row { grid-template-columns: minmax(0,1fr) 74px 32px !important; }
.favorite-category-select { width: 74px; min-height: 32px; padding: 0 5px; font-size: 11px; }

.admin-operations-entry { color: var(--accent-strong); }
.admin-operations-modal { width: min(560px, calc(100vw - 20px)); }
.admin-health-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; padding: 0 18px 16px; }
.admin-health-card { min-height: 58px; display: flex; align-items: center; gap: 9px; padding: 10px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); }
.admin-health-card.wide { grid-column: 1 / -1; }
.admin-health-card svg { width: 19px; height: 19px; color: var(--accent); }
.admin-health-card.tone-warning svg { color: #b8862f; }
.admin-health-card.tone-error svg { color: var(--danger); }
.admin-health-card span { min-width: 0; display: grid; gap: 2px; }
.admin-health-card small { color: var(--muted); overflow-wrap: anywhere; }
.admin-moderation-section { display: grid; gap: 10px; margin: 0 18px 18px; padding-top: 14px; border-top: 1px solid var(--line); }
.admin-moderation-section header { display: grid; gap: 3px; }
.admin-moderation-section header > div { display: flex; justify-content: space-between; gap: 10px; }
.admin-moderation-section header span, .admin-moderation-section header small { color: var(--muted); font-size: 11px; }
.admin-moderation-section textarea { width: 100%; resize: vertical; }

@media (max-width: 760px) {
  .market-chart-toolbar { flex-wrap: wrap; }
  .market-chart-actions { order: 3; width: 100%; justify-content: flex-end; }
  .jin10-pane.market-fullscreen .market-chart-actions { width: auto; margin-left: auto; }
  .price-alert-form { grid-template-columns: 1fr 1fr; }
  .price-alert-form .primary-button { grid-column: 1 / -1; }
  .strategy-price-track { height: 205px; }
}

/* h53: the fullscreen chart owns the complete landscape viewport. */
.admin-operations-modal {
  max-height: calc(var(--app-height, 100dvh) - 18px);
  overflow-y: auto;
}

.admin-report-row {
  gap: 9px;
  border-left: 3px solid #d8a438;
}

.admin-report-row.status-resolved { border-left-color: var(--accent); opacity: 1; }
.admin-report-row.status-dismissed { border-left-color: #9aa5a1; opacity: 1; }

.admin-report-parties {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 18px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  padding: 8px;
  border-radius: 6px;
  background: var(--canvas);
}

.admin-report-parties > span { display: grid; gap: 2px; color: var(--muted); font-size: 9px; }
.admin-report-parties b { color: var(--ink); font-size: 12px; }
.admin-report-parties small { overflow-wrap: anywhere; }
.admin-report-parties svg { width: 14px; height: 14px; color: var(--muted); }
.admin-report-message { padding: 10px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); }
.admin-report-message > small { display: block; margin-bottom: 5px; color: var(--muted); font-size: 9px; }
.admin-report-message p { max-height: 132px; overflow-y: auto; white-space: pre-wrap; }
.admin-report-reason { display: grid; grid-template-columns: 62px minmax(0, 1fr); gap: 8px; font-size: 10px; }
.admin-report-reason span { color: var(--muted); overflow-wrap: anywhere; }
.admin-report-actions { display: grid !important; grid-template-columns: minmax(118px, 1fr) auto auto; align-items: center; }
.admin-report-actions select { min-width: 0; height: 34px; border: 1px solid var(--line); border-radius: 6px; color: var(--ink); background: var(--surface); }
.admin-report-result { justify-content: flex-start !important; padding-top: 7px; border-top: 1px solid var(--line); }
.admin-report-result span { display: grid; gap: 3px; }
.admin-report-result strong { color: var(--accent-strong); }
.admin-report-result small { color: var(--muted); font-size: 9px; }
.admin-report-result em { margin-top: 3px; color: var(--ink); font-size: 10px; font-style: normal; }

@media (max-width: 520px) {
  .admin-report-actions { grid-template-columns: 1fr 1fr; }
  .admin-report-actions select { grid-column: 1 / -1; }
}

@media (orientation: landscape) {
  .jin10-pane.market-fullscreen {
    width: 100vw !important;
    height: 100dvh !important;
    min-height: 0 !important;
  }

  .jin10-pane.market-fullscreen .jin10-content {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100% !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  .jin10-pane.market-fullscreen .gold-market-overview {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100% !important;
    margin: 0;
    padding: 0;
    overflow: hidden;
  }

  .jin10-pane.market-fullscreen .market-chart-section {
    position: absolute;
    inset: 0;
    display: grid !important;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    width: 100%;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;
  }

  .jin10-pane.market-fullscreen .market-chart-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(0, .85fr) auto;
    align-items: stretch;
    min-height: 36px;
  }

  .jin10-pane.market-fullscreen .market-period-switch,
  .jin10-pane.market-fullscreen .market-indicator-switch {
    min-width: 0;
    padding: 0;
    border-bottom: 0;
    overflow: hidden;
  }

  .jin10-pane.market-fullscreen .market-period-switch button,
  .jin10-pane.market-fullscreen .market-indicator-switch button {
    height: 36px;
    min-width: 0;
    padding: 0 3px;
    font-size: 10px;
  }

  .jin10-pane.market-fullscreen .market-chart-actions {
    order: initial;
    width: auto;
    align-items: center;
    gap: 4px;
    margin: 0;
    padding: 2px 6px;
    border-left: 1px solid var(--line);
  }

  .jin10-pane.market-fullscreen .market-chart-actions button { width: 32px; height: 32px; }
  .jin10-pane.market-fullscreen .market-chart-legend { min-height: 28px; padding: 3px 10px; }

  .jin10-pane.market-fullscreen .market-chart-stage,
  .jin10-pane.market-fullscreen .market-chart-stage .market-chart,
  .jin10-pane.market-fullscreen .market-chart-section .jin10-loading {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
  }

  .jin10-pane.market-fullscreen .market-chart-stage { align-self: stretch; }
  .jin10-pane.market-fullscreen .market-lower-indicators { min-height: 28px; padding: 4px 10px; }
}

/* h50: larger mobile chart and expanded decision formula. */
.decision-formula-body {
  display: grid;
  gap: 5px;
  padding-top: 8px;
}

.decision-formula-body p {
  margin: 0;
}

.decision-formula-body b {
  color: var(--ink);
}

.decision-formula-body small {
  display: block;
  margin-top: 3px;
  padding-top: 7px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  line-height: 1.65;
}

@media (max-width: 760px) {
  .market-chart-stage,
  .market-chart-stage .market-chart {
    height: clamp(225px, calc(var(--app-height, 100dvh) - 425px), 320px);
    min-height: 225px;
  }

  .market-chart-section .jin10-loading {
    height: clamp(225px, calc(var(--app-height, 100dvh) - 425px), 320px);
    min-height: 225px;
  }
}

/* h56: roomier group members and profile-only IDs. */
html body #memberList {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

html body #memberList .member-row {
  min-height: 96px;
  padding: 9px 5px 7px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

html body #memberList .member-profile-main {
  width: 100%;
  min-height: 78px;
  flex: 1 1 auto;
  flex-direction: column;
  justify-content: flex-start;
  gap: 7px;
  text-align: center;
}

html body #memberList .member-profile-main .small-avatar {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  font-size: 14px;
}

html body #memberList .member-copy {
  display: grid;
  min-width: 0;
  gap: 3px;
  justify-items: center;
}

html body #memberList .member-copy strong {
  width: 100%;
  font-size: 11px;
}

html body #memberList .member-role-label {
  min-height: 16px;
  padding: 2px 6px;
  border-radius: 4px;
  color: #725b2f;
  background: #fff4d6;
  font-size: 8px;
  line-height: 12px;
}

html body #memberList .member-row > .mini-icon-button {
  position: absolute;
  top: 5px;
  right: 5px;
  width: 24px;
  height: 24px;
  border-radius: 6px;
  background: color-mix(in srgb, var(--surface) 88%, transparent);
}

html[data-theme="dark"] body #memberList .member-role-label {
  color: #efd696;
  background: #40371f;
}

/* h55: compact strategy editor, simplified decisions, and user profiles. */
.avatar img,
.small-avatar img,
.message-avatar img,
.profile-avatar img,
.user-profile-avatar img,
#profileAvatarPreview img {
  width: 100%;
  height: 100%;
  border-radius: inherit;
  object-fit: cover;
}

.chat-avatar-button,
.profile-avatar-button,
.avatar-profile-trigger {
  padding: 0;
  border: 0;
  color: white;
  cursor: pointer;
}

dialog.modal.realtime-editor-modal[open] {
  display: block;
  width: min(680px, calc(100vw - 18px));
  height: min(780px, calc(var(--app-height, 100dvh) - 16px));
  max-height: calc(var(--app-height, 100dvh) - 16px);
  overflow: hidden;
}

.realtime-editor-modal form {
  height: 100%;
  max-height: none;
}

.realtime-editor-modal .modal-header,
.realtime-editor-modal .modal-actions {
  flex: 0 0 auto;
}

.realtime-editor-modal .modal-header {
  min-height: 70px;
  padding: 12px 18px;
}

.realtime-editor-scroll {
  min-height: 0;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 14px 16px 8px;
  -webkit-overflow-scrolling: touch;
}

.realtime-editor-modal .realtime-editor-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  max-height: none;
  overflow: visible;
  padding: 0;
}

.realtime-editor-modal .field-group,
.realtime-editor-modal fieldset {
  padding: 0;
}

.realtime-editor-modal .field-group label,
.realtime-target-row label > span,
.realtime-advanced-grid label > span {
  margin-bottom: 5px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
}

.realtime-editor-modal input,
.realtime-editor-modal select {
  min-height: 40px;
}

.realtime-editor-modal textarea {
  min-height: 58px;
  padding: 9px 11px;
}

.realtime-target-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.realtime-target-row label,
.realtime-advanced-grid label {
  display: grid;
  min-width: 0;
}

.realtime-advanced,
.realtime-result-editor {
  overflow: hidden;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
}

.realtime-advanced > summary,
.realtime-result-editor > summary {
  display: grid;
  min-height: 44px;
  grid-template-columns: minmax(0, 1fr) auto 18px;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  cursor: pointer;
  list-style: none;
}

.realtime-advanced > summary::-webkit-details-marker,
.realtime-result-editor > summary::-webkit-details-marker { display: none; }
.realtime-advanced > summary span,
.realtime-result-editor > summary span { font-size: 12px; font-weight: 800; }
.realtime-advanced > summary small,
.realtime-result-editor > summary small { color: var(--muted); font-size: 9px; }
.realtime-advanced > summary svg,
.realtime-result-editor > summary svg { width: 16px; height: 16px; transition: transform 160ms ease; }
.realtime-advanced[open] > summary svg,
.realtime-result-editor[open] > summary svg { transform: rotate(180deg); }

.realtime-advanced-grid,
.realtime-result-editor-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  padding: 0 12px 12px;
}

.realtime-result-editor.is-disabled > summary { opacity: .65; }
.realtime-result-editor.is-disabled .realtime-result-editor-grid { opacity: .5; }
.realtime-editor-modal .modal-actions { padding: 10px 16px max(12px, env(safe-area-inset-bottom)); }

.decision-title-actions { display: flex; align-items: center; gap: 8px; }
.decision-title-actions button,
.decision-history-link {
  border: 1px solid var(--line);
  color: var(--accent-strong);
  background: var(--surface);
}
.decision-title-actions button { min-height: 30px; padding: 0 9px; border-radius: 6px; font-size: 10px; }
.decision-editor-modal { width: min(560px, calc(100vw - 18px)); }
.decision-editor-grid.decision-editor-compact { grid-template-columns: 1fr; gap: 12px; max-height: none; overflow: visible; padding: 14px 16px 4px; }
.decision-editor-compact .field-group { padding: 0; }
.decision-history-link { display: grid; width: 100%; min-height: 58px; grid-template-columns: 22px minmax(0, 1fr) 18px; align-items: center; gap: 10px; padding: 0 12px; border-radius: 7px; text-align: left; }
.decision-history-link > span { display: grid; gap: 2px; }
.decision-history-link small { color: var(--muted); font-size: 10px; }
.decision-history-link svg { width: 18px; height: 18px; }

.profile-avatar-button { display: grid; place-items: center; }
.profile-editor-content { display: grid; justify-items: center; gap: 12px; padding: 18px 20px 4px; }
.profile-editor-content .field-group { width: 100%; padding: 0; }
.profile-avatar-picker { position: relative; width: 84px; height: 84px; padding: 0; border: 0; border-radius: 50%; background: transparent; }
.profile-avatar-picker > span { display: grid; width: 84px; height: 84px; place-items: center; overflow: hidden; border-radius: 50%; color: white; font-size: 25px; font-weight: 800; }
.profile-avatar-picker > svg { position: absolute; right: -2px; bottom: 1px; width: 30px; height: 30px; padding: 7px; border: 2px solid white; border-radius: 50%; color: white; background: var(--accent-strong); }
.profile-editor-id { margin: 0; color: var(--muted); font-size: 11px; }
.user-profile-content { display: grid; justify-items: center; gap: 7px; padding: 24px 20px 10px; }
.user-profile-avatar { display: grid; width: 88px; height: 88px; place-items: center; overflow: hidden; border-radius: 50%; color: white; font-size: 28px; font-weight: 800; }
.user-profile-content > strong { margin-top: 6px; font-size: 20px; }
.user-profile-content > span { color: var(--muted); font-size: 12px; }
.user-profile-content > small { color: var(--accent-strong); font-size: 11px; }
.user-profile-actions { justify-content: center; }
.user-profile-actions button { min-width: 150px; }

.contact-profile-row { display: flex; align-items: center; gap: 10px; padding: 0 10px; }
.contact-profile-main,
.member-profile-main { display: flex; min-width: 0; flex: 1 1 auto; align-items: center; gap: 10px; padding: 0; border: 0; color: inherit; text-align: left; background: transparent; }
.contact-profile-main { min-height: 52px; justify-content: space-between; }
.contact-profile-main > svg { width: 17px; height: 17px; color: var(--muted); }
.member-row .member-profile-main { min-height: 50px; }
.member-row > .mini-icon-button { flex: 0 0 auto; }
.avatar-profile-trigger { overflow: hidden; border-radius: 50%; }

html[data-theme="dark"] .realtime-advanced,
html[data-theme="dark"] .realtime-result-editor,
html[data-theme="dark"] .decision-history-link,
html[data-theme="dark"] .decision-title-actions button { color: var(--ink); border-color: var(--line); background: var(--surface); }

@media (max-width: 480px) {
  .realtime-editor-scroll { padding: 10px 12px 6px; }
  .realtime-editor-modal .realtime-editor-grid,
  .realtime-result-editor-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .realtime-target-row { gap: 6px; }
  .realtime-target-row input { padding-right: 7px; padding-left: 7px; font-size: 12px; }
  .realtime-editor-modal .modal-actions button { min-width: 0; flex: 1 1 0; }
  .decision-editor-modal { width: calc(100vw - 12px); }
  .decision-title-actions { align-items: flex-end; flex-direction: column; gap: 4px; }
}

/* Realtime strategy cards synced into the administrator analysis group. */
.strategy-message-row {
  margin-top: 4px;
  margin-bottom: 20px;
}

.strategy-message-row.group-message .strategy-message-avatar {
  margin-top: 22px;
  background: #0d796e !important;
}

.strategy-message-column {
  width: min(86%, 430px);
  max-width: 430px;
}

.strategy-message-card {
  width: 100%;
  overflow: hidden;
  padding: 0;
  border: 1px solid #d8e1df;
  border-radius: 8px;
  color: #172522;
  background: #fff;
  box-shadow: 0 4px 14px rgba(20, 49, 44, .07);
  text-align: left;
  letter-spacing: 0;
  cursor: pointer;
}

.strategy-message-card > header {
  display: flex;
  min-height: 82px;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  padding: 13px 14px 11px;
  border-bottom: 1px solid #e2e8e6;
}

.strategy-message-card > header div { min-width: 0; }
.strategy-message-card > header span,
.strategy-message-card > header h3,
.strategy-message-card > header small { display: block; }
.strategy-message-card > header span { color: #0d796e; font-size: 10px; font-weight: 700; }
.strategy-message-card > header h3 { overflow: hidden; margin: 4px 0 2px; font-size: 16px; line-height: 22px; text-overflow: ellipsis; white-space: nowrap; }
.strategy-message-card > header small { color: #89928f; font-size: 9px; }
.strategy-message-card > header > b { flex: 0 0 auto; padding: 5px 8px; border-radius: 6px; color: #0d796e; background: #e8f5f1; font-size: 10px; }
.strategy-message-card.loss > header span { color: #b54653; }
.strategy-message-card.loss > header > b { color: #b54653; background: #fcebed; }
.strategy-message-card.profit > header > b { color: #0a7c68; background: #e7f5f0; }

.strategy-card-plan {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid #e8eceb;
}

.strategy-card-plan > span { min-width: 0; padding: 12px 14px; }
.strategy-card-plan > span + span { border-left: 1px solid #e8eceb; }
.strategy-card-plan small,
.strategy-card-plan strong,
.strategy-card-route small,
.strategy-card-route strong { display: block; }
.strategy-card-plan small,
.strategy-card-route small { color: #8a9390; font-size: 9px; }
.strategy-card-plan strong { overflow: hidden; margin-top: 3px; color: #0d796e; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.strategy-card-plan .stop strong { color: #b64c57; }
.strategy-card-location { display: flex; align-items: flex-start; gap: 8px; padding: 9px 14px; border-bottom: 1px solid #e8eceb; color: #35443f; background: #f5faf8; }
.strategy-card-location > svg { width: 15px; height: 15px; flex: 0 0 auto; margin-top: 2px; color: #0d796e; }
.strategy-card-location > div { min-width: 0; }
.strategy-card-location strong, .strategy-card-location span { display: block; overflow-wrap: anywhere; }
.strategy-card-location strong { font-size: 10px; line-height: 15px; }
.strategy-card-location span { margin-top: 2px; color: #78847f; font-size: 9px; line-height: 14px; }

.strategy-card-targets { padding: 11px 14px 12px; }
.strategy-card-targets > small { display: block; margin-bottom: 6px; color: #8a9390; font-size: 9px; }
.strategy-card-targets > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: hidden; border: 1px solid #eadcb9; border-radius: 7px; background: #fff9ec; }
.strategy-card-targets span { overflow: hidden; padding: 8px 4px; color: #7a6325; font-size: 12px; font-weight: 700; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.strategy-card-targets span + span { border-left: 1px solid #eadcb9; }

.strategy-card-note { margin: 0 14px 13px; padding: 9px 10px; border-left: 3px solid #159182; border-radius: 0 5px 5px 0; color: #4f5d59; background: #f1f5f4; font-size: 10px; line-height: 17px; }
.strategy-message-card.loss .strategy-card-note { border-left-color: #c25661; }

.strategy-card-result-head { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-bottom: 1px solid #e8eceb; background: #12352f; color: #fff; }
.strategy-card-asset { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border-radius: 7px; color: #4d3c13; background: #d8ad43; font-size: 11px; font-weight: 800; }
.strategy-card-result-head > div { min-width: 0; flex: 1; }
.strategy-card-result-head strong,
.strategy-card-result-head small { display: block; }
.strategy-card-result-head strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.strategy-card-result-head small { margin-top: 2px; color: #b8cbc6; font-size: 9px; }
.strategy-card-result-head > b { flex: 0 0 auto; font-size: 22px; }
.strategy-card-result-head > b.profit { color: #69d0bb; }
.strategy-card-result-head > b.loss { color: #ff9da8; }

.strategy-card-route { display: grid; grid-template-columns: 1fr 22px 1fr; align-items: center; gap: 5px; padding: 12px 14px; }
.strategy-card-route > span { min-width: 0; padding: 8px 9px; border-radius: 6px; background: #f3f5f4; }
.strategy-card-route strong { overflow: hidden; margin-top: 3px; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.strategy-card-route > svg { width: 15px; height: 15px; color: #8d9693; }

.strategy-message-card > footer { display: flex; min-height: 42px; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 14px; border-top: 1px solid #e2e8e6; color: #8a9390; font-size: 9px; }
.strategy-message-card > footer strong { display: flex; align-items: center; color: #0d796e; font-size: 10px; }
.strategy-message-card > footer svg { width: 13px; height: 13px; }

html[data-theme="dark"] .strategy-message-card { color: #edf5f2; border-color: #354a45; background: #202826; }
html[data-theme="dark"] .strategy-message-card > header,
html[data-theme="dark"] .strategy-card-plan,
html[data-theme="dark"] .strategy-card-plan > span + span,
html[data-theme="dark"] .strategy-message-card > footer { border-color: #354a45; }
html[data-theme="dark"] .strategy-card-targets > div { border-color: #645735; background: #35301f; }
html[data-theme="dark"] .strategy-card-targets span + span { border-color: #645735; }
html[data-theme="dark"] .strategy-card-note,
html[data-theme="dark"] .strategy-card-route > span,
html[data-theme="dark"] .strategy-card-location { color: #b8c7c3; border-color: #354a45; background: #29322f; }

@media (max-width: 420px) {
  .strategy-message-row { gap: 8px; }
  .strategy-message-row .message-avatar { width: 32px; height: 32px; }
  .strategy-message-column { width: calc(100% - 40px); max-width: none; }
  .strategy-message-card > header { padding-right: 11px; padding-left: 11px; }
  .strategy-card-plan > span,
  .strategy-card-location,
  .strategy-card-targets,
  .strategy-card-route { padding-right: 11px; padding-left: 11px; }
  .strategy-card-note { margin-right: 11px; margin-left: 11px; }
}

* {
  box-sizing: border-box;
}

[hidden] {
  display: none !important;
}

body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  color: var(--ink);
  background: #edf1ef;
  letter-spacing: 0;
}

.launch-screen {
  display: grid;
  min-height: 100dvh;
  place-items: center;
  background: #f8f3f4;
}

.launch-brand {
  display: flex;
  align-items: center;
  gap: 12px;
}

.launch-brand .brand-mark {
  width: 52px;
  height: 52px;
  font-size: 22px;
}

.launch-brand strong {
  font-size: 22px;
  line-height: 30px;
}

.auth-screen {
  display: grid;
  min-height: 100dvh;
  padding: 24px;
  place-items: center;
  background: #f8f3f4;
}

.auth-panel {
  width: min(420px, 100%);
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  box-shadow: 0 18px 50px rgba(83, 48, 53, 0.1);
}

.auth-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 28px;
}

.auth-brand h1,
.auth-brand p {
  margin: 0;
}

.auth-brand h1 {
  font-size: 20px;
  line-height: 28px;
}

.auth-brand p {
  color: var(--muted);
  font-size: 12px;
  line-height: 18px;
}

.auth-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  margin-bottom: 24px;
  padding: 4px;
  border-radius: 8px;
  background: #f4edef;
}

.auth-tab {
  height: 38px;
  border: 0;
  border-radius: 6px;
  color: var(--muted);
  background: transparent;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.auth-tab.active {
  color: var(--ink);
  background: white;
  box-shadow: 0 1px 3px rgba(20, 28, 36, 0.1);
}

.auth-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.auth-form .field-group {
  margin: 0;
  padding: 0;
}

.auth-form .field-group input {
  background: #fbfcfd;
}

.auth-error {
  margin: -4px 0 0 !important;
}

.full-button {
  width: 100%;
  margin-top: 2px;
}

.app-download-button {
  display: flex;
  min-height: 52px;
  align-items: center;
  gap: 12px;
  margin-top: 18px;
  padding: 8px 12px;
  border: 1px solid #d9dfe3;
  border-radius: 8px;
  color: var(--ink);
  background: #f7f9fa;
  text-decoration: none;
}

.app-download-button:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.app-download-button > svg {
  width: 20px;
  height: 20px;
  color: var(--accent-strong);
}

.app-download-button span,
.app-download-button strong,
.app-download-button small {
  display: block;
}

.app-download-button span {
  min-width: 0;
}

.app-download-button strong {
  font-size: 13px;
  line-height: 20px;
}

.app-download-button small {
  color: var(--muted);
  font-size: 10px;
  line-height: 16px;
}

button,
input {
  font: inherit;
}

button {
  color: inherit;
}

button:disabled,
input:disabled {
  cursor: not-allowed;
  opacity: 0.58;
}

button:focus-visible,
input:focus-visible,
.sound-setting-row select:focus-visible,
.composer textarea:focus-visible {
  outline: 3px solid rgba(223, 91, 99, 0.2);
  outline-offset: 2px;
}

.app-shell {
  position: relative;
  display: grid;
  grid-template-columns: 360px minmax(0, 1fr);
  width: min(1440px, 100vw);
  height: min(920px, 100vh);
  min-height: 640px;
  margin: max(0px, calc((100vh - 920px) / 2)) auto 0;
  overflow: hidden;
  background: var(--surface);
  box-shadow: var(--shadow);
}

.conversation-pane {
  display: flex;
  min-width: 0;
  flex-direction: column;
  border-right: 1px solid var(--line);
  background: #fffdfd;
}

.brand-bar,
.chat-header,
.drawer-header,
.modal-header {
  display: flex;
  align-items: center;
}

.brand-bar {
  height: 96px;
  padding: 22px 22px 16px;
}

.brand-mark {
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  color: white;
  background: var(--coral);
  font-size: 18px;
  font-weight: 700;
}

.brand-bar > div:nth-child(2) {
  min-width: 0;
  margin-left: 12px;
}

.brand-copy {
  min-width: 66px;
}

.brand-bar h1,
.brand-bar p,
.chat-heading h2,
.chat-heading p,
.drawer-header h2,
.drawer-header p,
.modal-header h2,
.modal-header p,
.member-heading h3 {
  margin: 0;
}

.brand-bar h1 {
  font-size: 18px;
  line-height: 24px;
}

.brand-bar p,
.drawer-header p,
.modal-header p {
  color: var(--muted);
  font-size: 12px;
  line-height: 18px;
}

.brand-actions {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-left: auto;
}

.brand-actions .icon-button {
  width: 38px;
  height: 38px;
}

.icon-button,
.send-button {
  display: grid;
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 8px;
  background: transparent;
  cursor: pointer;
}

.icon-button:hover {
  background: #edf0f2;
}

.icon-button.dark {
  color: white;
  background: var(--coral);
}

.icon-button.dark:hover {
  background: var(--coral-strong);
}

.with-indicator {
  position: relative;
}

.request-indicator {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 8px;
  height: 8px;
  border: 2px solid white;
  border-radius: 50%;
  background: var(--coral);
}

.icon-button svg,
.send-button svg,
.search-wrap svg,
.mute-banner svg {
  width: 19px;
  height: 19px;
  stroke-width: 2;
}

.search-wrap {
  position: relative;
  margin: 4px 22px 20px;
}

.search-wrap svg {
  position: absolute;
  top: 50%;
  left: 13px;
  color: #8a919a;
  transform: translateY(-50%);
  pointer-events: none;
}

.search-wrap input,
.composer textarea,
.field-group input {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  background: white;
}

.search-wrap input {
  height: 42px;
  padding: 0 14px 0 42px;
  background: #f6eff0;
  border-color: transparent;
}

.section-label {
  display: flex;
  justify-content: space-between;
  padding: 0 24px 10px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.conversation-list {
  min-height: 0;
  flex: 1;
  overflow-y: auto;
  padding: 0 10px 18px;
}

.account-bar {
  display: none;
  min-height: 72px;
  align-items: center;
  gap: 11px;
  padding: 12px 16px;
  border-top: 1px solid var(--line);
  background: white;
}

.mobile-nav {
  display: grid;
  min-height: 64px;
  grid-template-columns: repeat(6, 1fr);
  padding: 6px 10px;
  border-top: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.98);
}

.mobile-nav-item {
  position: relative;
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 3px;
  padding: 5px 0;
  border: 0;
  color: #8c8587;
  background: transparent;
  font-size: 9px;
  cursor: pointer;
}

.mobile-nav-item svg {
  width: 20px;
  height: 20px;
}

.mobile-nav-item.active {
  color: var(--coral);
}

.mobile-request-indicator {
  position: absolute;
  top: 4px;
  left: calc(50% + 7px);
  width: 8px;
  height: 8px;
  border: 2px solid white;
  border-radius: 50%;
  background: var(--coral);
}

.mobile-unread-indicator {
  position: absolute;
  top: 1px;
  left: calc(50% + 7px);
  display: grid !important;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  place-items: center;
  border: 2px solid white;
  border-radius: 9px;
  color: white;
  background: var(--coral);
  font-size: 8px;
  font-weight: 700;
  line-height: 13px;
}

.jin10-pane,
.realtime-pane,
.decision-pane,
.utility-pane {
  position: absolute;
  z-index: 4;
  top: 0;
  right: 0;
  bottom: 0;
  left: 360px;
  display: none;
  min-width: 0;
  flex-direction: column;
  background: #f6f7f8;
}

.app-shell.market-open .jin10-pane,
.app-shell.realtime-open .realtime-pane,
.app-shell.decision-open .decision-pane,
.app-shell.contacts-open .contacts-pane,
.app-shell.profile-open .profile-pane {
  display: flex;
}

.utility-header {
  display: flex;
  min-height: 78px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 20px;
  border-bottom: 1px solid var(--line);
  background: white;
}

.utility-header h2,
.utility-header p {
  margin: 0;
}

.utility-header h2 {
  font-size: 17px;
  line-height: 24px;
}

.utility-header p {
  color: var(--muted);
  font-size: 11px;
  line-height: 17px;
}

.utility-content {
  min-height: 0;
  flex: 1;
  overflow-y: auto;
}

.contacts-content {
  padding: 0 20px 28px;
}

.profile-page-content {
  display: grid;
  padding: 32px 20px;
  place-items: start center;
}

.profile-page-content .profile-content {
  width: min(420px, 100%);
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
}

.jin10-header {
  display: flex;
  min-height: 78px;
  align-items: center;
  gap: 12px;
  padding: 14px 20px;
  border-bottom: 1px solid var(--line);
  background: white;
}

.realtime-header { display:flex; min-height:78px; align-items:center; gap:12px; padding:14px 20px; border-bottom:1px solid var(--line); background:white; }
.realtime-mark { display:grid; width:42px; height:42px; flex:0 0 auto; place-items:center; border-radius:8px; color:white; background:#177d77; }
.realtime-mark svg { width:21px; height:21px; }
.realtime-heading { min-width:0; flex:1; }
.realtime-heading h2, .realtime-heading p { margin:0; }
.realtime-heading h2 { font-size:16px; line-height:23px; }
.realtime-heading p { color:var(--muted); font-size:11px; line-height:17px; }
.realtime-refresh, .realtime-history-button { background:#eef0f2; }
.realtime-header-edit { color:#177d77; background:#e7f3f1; }
.realtime-live-strip { display:flex; min-height:40px; align-items:center; gap:8px; padding:0 20px; border-bottom:1px solid #d7ebe7; color:#286b63; background:#edf8f5; font-size:11px; }
.realtime-live-strip > span { width:7px; height:7px; flex:0 0 auto; border-radius:50%; background:#2d9b80; box-shadow:0 0 0 3px rgba(45,155,128,.13); }
.realtime-live-strip small { overflow:hidden; margin-left:auto; color:#6c817d; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.realtime-content { min-height:0; flex:1; overflow-y:auto; }
.realtime-page { width:min(820px,100%); margin:0 auto; padding:16px 18px 28px; }
.realtime-symbol-row { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.realtime-symbol-row strong, .realtime-symbol-row span { display:block; }
.realtime-symbol-row strong { font-size:17px; }
.realtime-symbol-row div > span { margin-top:2px; color:var(--muted); font-size:10px; }
.realtime-direction { padding:5px 9px; border-radius:6px; color:#246b5b; background:#e7f3f1; font-size:11px; font-weight:700; }
.realtime-direction.short { color:#b54a55; background:#fcebed; }
.realtime-card { padding:15px; border:1px solid #dce4e2; border-radius:8px; background:white; }
.realtime-card > header { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.realtime-card h3, .realtime-card p { margin:0; }
.realtime-card h3 { font-size:17px; }
.realtime-card > header p { margin-top:4px; color:var(--muted); font-size:10px; }
.realtime-card > header > span { padding:5px 8px; border-radius:6px; color:#267665; background:#e7f3f1; font-size:10px; font-weight:700; white-space:nowrap; }
.realtime-card.status-completed > header > span { color:#55606a; background:#edf0f2; }
.realtime-card.status-invalid > header > span { color:#a94a54; background:#fcebed; }
.realtime-card.status-expired,
.realtime-card.status-stopped { opacity:.78; filter:saturate(.72); }
.realtime-card.status-expired > header > span,
.realtime-card.status-stopped > header > span { color:#a94a54; background:#fcebed; }
.realtime-card.status-completed > header > span { color:#347466; background:#e8f5f1; }
.realtime-card.status-partial > header > span { color:#9b6a16; background:#fff5da; }
.strategy-location { display:flex; gap:10px; align-items:flex-start; margin-top:12px; padding:12px; border:1px solid #dce7e4; background:#f6faf9; }
.strategy-location > svg { width:18px; flex:none; color:#177d77; }
.strategy-location div { display:grid; gap:3px; min-width:0; }
.strategy-location strong { font-size:13px; }
.strategy-location span { color:var(--muted); font-size:12px; }
.strategy-risk-disclaimer { display:flex; gap:9px; align-items:flex-start; margin-top:12px; padding:12px; border-top:1px solid #ecd8a8; color:#735816; background:#fffaf0; font-size:12px; line-height:1.55; }
.strategy-risk-disclaimer svg { width:18px; flex:none; }
.realtime-stat-filters { display:flex; gap:8px; justify-content:flex-end; }
.realtime-stat-filters select { min-width:120px; }
.realtime-advanced-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:12px 0; }
.realtime-advanced-grid > div { display:grid; gap:4px; padding:10px; border:1px solid var(--line); background:var(--panel); }
.realtime-advanced-grid span { color:var(--muted); font-size:11px; }
.market-chart-section { margin-top:12px; padding:14px; background:#fff; border:1px solid var(--line); border-radius:8px; }
.market-chart-section > header { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:10px; }
.market-chart-section header span,.market-chart-section header small,.market-chart-section > p { color:var(--muted); font-size:11px; }
.market-chart-section h3 { margin:2px 0 0; font-size:16px; }
.market-chart { width:100%; min-height:300px; position:relative; }
.market-chart-section > p { margin:8px 0 0; }
.gold-price-location { display:flex; align-items:center; gap:6px; margin:10px 0 0; font-size:12px; color:#177d77; }
.gold-price-location svg { width:15px; }
.decision-formula { margin:8px 0 12px; padding:9px 11px; border:1px solid var(--line); background:var(--panel); font-size:11px; }
.decision-formula summary { color:#177d77; cursor:pointer; font-weight:700; }
.decision-formula p { margin:8px 0 0; color:var(--muted); line-height:1.65; }
.calendar-star-filter { display:flex; gap:3px; padding:3px; background:#eef2f1; }
.calendar-star-filter button { border:0; padding:6px 9px; background:transparent; color:var(--muted); }
.calendar-star-filter button.active { background:#fff; color:#0d796e; box-shadow:0 1px 2px rgba(0,0,0,.08); }
.calendar-countdown { color:#8a661f; font-size:10px; white-space:nowrap; }
.notification-category-settings { display:grid; gap:8px; padding:14px; border:1px solid var(--line); }
.notification-category-settings header { display:flex; gap:10px; align-items:center; }
.notification-category-settings header svg { width:20px; }
.notification-category-settings header div { display:grid; }
.notification-category-settings header span { color:var(--muted); font-size:12px; }
.notification-category-settings label { display:flex; align-items:center; justify-content:space-between; padding:8px 0; border-top:1px solid var(--line); }
.risk-calculator-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding:16px; }
.risk-calculator-grid label { display:grid; gap:6px; color:var(--muted); font-size:12px; }
.risk-calculator-result { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:0 16px 16px; padding:14px; background:#f3f8f6; }
.risk-calculator-result span { display:grid; gap:4px; }
.risk-calculator-result strong { font-size:20px; color:#177d77; }
.risk-calculator-result small { grid-column:1/-1; color:var(--muted); }
.mentioned-me { padding:2px 5px; background:#df5b63; color:#fff; font-size:10px; }
.realtime-level-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:15px; }
.realtime-level-grid > div { min-width:0; min-height:64px; padding:10px 11px; border-left:3px solid #8a9499; border-radius:7px; background:#f5f7f7; }
.realtime-level-grid small, .realtime-level-grid strong { display:block; }
.realtime-level-grid small { color:var(--muted); font-size:10px; }
.realtime-level-grid strong { overflow:hidden; margin-top:5px; font-size:16px; text-overflow:ellipsis; white-space:nowrap; }
.realtime-level-grid .entry { border-color:#177d77; background:#edf8f5; }
.realtime-level-grid .stop { border-color:#df5b63; background:#fcebed; }
.realtime-level-grid .target { border-color:#d59a3d; background:#fff5e3; }
.realtime-level-grid .exit { grid-column:1/-1; }
.realtime-level-grid .exit strong { white-space:normal; }
.realtime-note { margin-top:14px; padding:13px; border-radius:7px; background:#f0f3f2; }
.realtime-note div { display:flex; justify-content:space-between; gap:12px; }
.realtime-note div strong { font-size:12px; }
.realtime-note div span { color:var(--muted); font-size:10px; }
.realtime-note p { margin:8px 0 0; color:#596164; font-size:12px; line-height:1.7; white-space:pre-wrap; }
.realtime-empty { display:flex; min-height:280px; align-items:center; justify-content:center; flex-direction:column; gap:8px; color:var(--muted); }
.realtime-empty svg { width:32px; height:32px; color:#177d77; }
.realtime-empty strong { color:var(--ink); font-size:15px; }
.realtime-empty span { font-size:11px; }
.realtime-editor-modal { width:min(680px,calc(100vw - 24px)); }
.realtime-editor-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; max-height:64vh; overflow-y:auto; padding:2px 2px 8px; }
.realtime-editor-wide { grid-column:1/-1; }
.realtime-history-modal { width:min(650px,calc(100vw - 24px)); }
.realtime-history-list { display:flex; max-height:68vh; flex-direction:column; gap:10px; overflow-y:auto; }
.realtime-history-card { padding:13px; border:1px solid var(--line); border-radius:8px; background:white; }
.realtime-history-card header { display:flex; justify-content:space-between; gap:12px; }
.realtime-history-card header strong, .realtime-history-card header span { display:block; }
.realtime-history-card header strong { font-size:13px; }
.realtime-history-card header span, .realtime-history-card header small { color:var(--muted); font-size:10px; }
.realtime-history-card > div { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin-top:10px; }
.realtime-history-card > div span { padding:7px; border-radius:6px; color:var(--muted); background:#f2f4f4; font-size:9px; }
.realtime-history-card > div b { display:block; overflow:hidden; margin-top:3px; color:var(--ink); font-size:11px; text-overflow:ellipsis; }
.realtime-history-card > div b.loss { color:#c94c55; }
.realtime-history-levels { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin-top:8px; padding-top:8px; border-top:1px solid var(--line); }
.realtime-history-levels span { color:var(--muted); font-size:8px; }
.realtime-history-levels b { margin-left:3px; color:var(--ink); font-size:9px; }
.realtime-tabs { display:grid; grid-template-columns:1fr 1fr; gap:4px; margin:10px 18px 0; padding:4px; border-radius:8px; background:#e8eceb; }
.realtime-tabs button { min-height:34px; border:0; border-radius:6px; color:#737b7c; background:transparent; font-size:11px; font-weight:700; }
.realtime-tabs button.active { color:#177d77; background:white; box-shadow:0 1px 3px rgba(25,37,35,.12); }
.realtime-stats-page { width:min(820px,100%); margin:0 auto; padding:14px 18px 28px; }
.realtime-stat-section { padding:15px; border:1px solid #dce4e2; border-radius:8px; background:white; }
.realtime-stat-section + .realtime-stat-section { margin-top:12px; }
.realtime-stat-title { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.realtime-stat-title span, .realtime-stat-title h3 { display:block; margin:0; }
.realtime-stat-title span { color:#177d77; font-size:9px; font-weight:700; }
.realtime-stat-title h3 { margin-top:2px; font-size:14px; }
.realtime-stat-title small { color:var(--muted); font-size:9px; white-space:nowrap; }
.realtime-result-head { display:flex; align-items:center; gap:10px; margin-top:13px; padding:11px; border-radius:8px; background:#f1f4f3; }
.realtime-result-asset { display:grid; width:34px; height:34px; flex:0 0 auto; place-items:center; border-radius:8px; color:white; background:#20252b; font-size:10px; font-weight:700; }
.realtime-result-head > div { min-width:0; flex:1; }
.realtime-result-head > div strong, .realtime-result-head > div small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.realtime-result-head > div strong { font-size:12px; }
.realtime-result-head > div small { margin-top:3px; color:var(--muted); font-size:9px; }
.realtime-result-head > b { color:#168169; font-size:18px; text-align:right; white-space:nowrap; }
.realtime-result-head > b.loss { color:#c94c55; }
.realtime-result-head > b small { display:block; margin-top:2px; color:inherit; font-size:8px; font-weight:400; }
.realtime-result-route { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:8px; margin-top:11px; }
.realtime-result-route > div { min-width:0; padding:10px; border-radius:7px; background:#f6f8f7; }
.realtime-result-route span, .realtime-result-route strong { display:block; }
.realtime-result-route span { color:var(--muted); font-size:9px; }
.realtime-result-route strong { overflow-wrap:anywhere; margin-top:4px; font-size:14px; }
.realtime-result-route svg { width:16px; color:#8a9293; }
.realtime-result-note { margin:10px 0 0; color:#596164; font-size:10px; line-height:1.65; white-space:pre-wrap; }
.realtime-stat-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:13px; }
.realtime-stat-grid > div { padding:11px; border-radius:8px; background:#f3f5f4; }
.realtime-stat-grid span, .realtime-stat-grid strong { display:block; }
.realtime-stat-grid span { color:var(--muted); font-size:9px; }
.realtime-stat-grid strong { margin-top:4px; font-size:16px; }
.realtime-stat-grid .profit { background:#e7f3f1; }
.realtime-stat-grid .profit strong { color:#168169; }
.realtime-stat-grid .loss { background:#fcebed; }
.realtime-stat-grid .loss strong { color:#c94c55; }
.realtime-win-rate { margin-top:12px; }
.realtime-win-rate > div:first-child { display:flex; justify-content:space-between; color:#596164; font-size:9px; }
.realtime-win-rate-bar { height:7px; margin-top:7px; overflow:hidden; border-radius:5px; background:#f0d5d8; }
.realtime-win-rate-bar i { display:block; height:100%; border-radius:5px; background:#177d77; }
.realtime-result-history { margin-top:12px; border-top:1px solid var(--line); }
.realtime-result-history > div { display:grid; grid-template-columns:58px 1fr auto; align-items:center; gap:8px; min-height:39px; border-bottom:1px solid #edf0ef; font-size:9px; }
.realtime-result-history time { color:var(--muted); }
.realtime-result-history strong { overflow:hidden; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.realtime-result-history b { color:#168169; }
.realtime-result-history .loss b { color:#c94c55; }
.realtime-report-level-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:12px; }
.realtime-report-level-grid span { padding:10px; border-radius:8px; color:var(--muted); background:#f3f5f4; font-size:9px; }
.realtime-report-level-grid b { display:block; margin-top:4px; color:var(--ink); font-size:13px; font-variant-numeric:tabular-nums; }
.realtime-current-result { margin-top:14px; padding:12px 13px; border-radius:7px; background:#edf8f5; }
.realtime-current-result > div, .realtime-current-result > p { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0; }
.realtime-current-result > div span { color:#177d77; font-size:11px; font-weight:700; }
.realtime-current-result > div small { color:var(--muted); font-size:9px; }
.realtime-current-result > p { margin-top:9px; }
.realtime-current-result > p strong { font-size:12px; }
.realtime-current-result > p b { color:#168169; font-size:16px; }
.realtime-current-result > p b.loss { color:#c94c55; }
.realtime-result-editor { padding:14px; border:1px solid #cfe1dd; border-radius:8px; background:#f8fbfa; }
.realtime-result-editor-title { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:13px; }
.realtime-result-editor-title span, .realtime-result-editor-title strong { display:block; }
.realtime-result-editor-title span { color:#177d77; font-size:9px; font-weight:700; }
.realtime-result-editor-title strong { margin-top:2px; font-size:14px; }
.realtime-result-editor-title small { color:var(--muted); font-size:9px; }
.realtime-result-editor-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.realtime-result-editor.is-disabled { border-color:var(--line); background:#f4f5f5; }
.realtime-result-editor.is-disabled .realtime-result-editor-grid { opacity:.5; }

.decision-header {
  display: flex;
  min-height: 78px;
  align-items: center;
  gap: 12px;
  padding: 14px 20px;
  border-bottom: 1px solid var(--line);
  background: white;
}

.decision-mark {
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 8px;
  color: white;
  background: #246b5b;
}

.decision-mark svg { width: 21px; height: 21px; }
.decision-heading { min-width: 0; flex: 1; }
.decision-heading h2, .decision-heading p { margin: 0; }
.decision-heading h2 { font-size: 16px; line-height: 23px; }
.decision-heading p { color: var(--muted); font-size: 11px; line-height: 17px; }
.decision-refresh { background: #eef0f2; }
.decision-history-button { color: #4c5962; background: #eef0f2; }
.decision-header-edit { color: #246b5b; background: #edf7f4; }

.decision-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  margin: 14px 18px 0;
  padding: 4px;
  border-radius: 8px;
  background: #e9ecee;
}

.decision-tab {
  min-width: 0;
  height: 36px;
  padding: 0 8px;
  border: 0;
  border-radius: 6px;
  color: #6d747b;
  background: transparent;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.decision-tab.active { color: var(--ink); background: white; box-shadow: 0 1px 3px rgba(20, 28, 36, 0.1); }
.decision-content { min-height: 0; flex: 1; overflow-y: auto; }
.decision-page { width: min(820px, 100%); margin: 0 auto; padding: 14px 18px 28px; }
.decision-page section { padding: 15px 0; border-bottom: 1px solid var(--line); }
.decision-page section:last-child { border-bottom: 0; }
.decision-section-title { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.decision-section-title span { color: var(--muted); font-size: 11px; }
.decision-section-title h3 { margin: 3px 0 0; font-size: 17px; line-height: 24px; }
.decision-edit-button { min-height: 36px; padding: 0 13px; }
.decision-edit-button svg { width: 15px; height: 15px; }
.decision-readonly { display: flex; align-items: center; gap: 5px; color: var(--muted); font-size: 11px; white-space: nowrap; }
.decision-readonly svg { width: 14px; height: 14px; }
.decision-analysis-text { min-height: 88px; padding: 14px 15px; border-left: 3px solid #246b5b; color: #33393f; background: white; font-size: 14px; line-height: 1.75; white-space: pre-wrap; }

.decision-daily-status {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 58px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
}

.decision-daily-status.is-current { border-color: #c9e2d9; background: #f2faf7; }
.decision-daily-status.is-stale { border-color: #ecd4b2; background: #fff9ef; }
.decision-status-icon { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 7px; }
.decision-daily-status.is-current .decision-status-icon { color: #23715e; background: #dcefe9; }
.decision-daily-status.is-stale .decision-status-icon { color: #a96818; background: #f7e8cf; }
.decision-status-icon svg { width: 17px; height: 17px; }
.decision-daily-status > div { min-width: 0; }
.decision-daily-status strong, .decision-daily-status small { display: block; }
.decision-daily-status strong { font-size: 12px; line-height: 18px; }
.decision-daily-status small { overflow: hidden; margin-top: 1px; color: var(--muted); font-size: 10px; line-height: 15px; text-overflow: ellipsis; white-space: nowrap; }
.decision-daily-status button { height: 30px; padding: 0 10px; border: 0; border-radius: 6px; color: white; background: #246b5b; font-size: 11px; font-weight: 700; cursor: pointer; }
.decision-status-lock { display: flex; align-items: center; gap: 4px; color: var(--muted); font-size: 10px; white-space: nowrap; }
.decision-status-lock svg { width: 12px; height: 12px; }
.decision-stance { padding: 5px 9px; border-radius: 6px; color: #246b5b; background: #e8f4f0; font-size: 11px; white-space: nowrap; }
.decision-section-title > small { color: var(--muted); font-size: 10px; }

.decision-level-matrix { overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: white; }
.decision-matrix-head, .decision-matrix-row { display: grid; grid-template-columns: 42px minmax(0, 1fr) minmax(0, 1fr); align-items: center; }
.decision-matrix-head { min-height: 38px; background: #f0f2f3; }
.decision-matrix-head > * { padding: 0 12px; font-size: 11px; }
.decision-matrix-head span { color: var(--muted); }
.decision-matrix-head strong { display: flex; align-items: center; gap: 5px; }
.decision-matrix-head strong svg { width: 14px; height: 14px; }
.decision-matrix-head .resistance { color: #b34c55; }
.decision-matrix-head .support { color: #23715e; }
.decision-matrix-row { min-height: 52px; border-top: 1px solid #edf0f1; }
.decision-matrix-row > b { color: #a0a5aa; font-size: 11px; text-align: center; }
.decision-matrix-row > span { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 8px; align-self: stretch; padding: 0 12px; border-left: 1px solid #edf0f1; }
.decision-matrix-row small { color: var(--muted); font-size: 11px; }
.decision-matrix-row strong { overflow: hidden; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
.decision-level-matrix.is-stale .decision-matrix-row strong { color: #a6aaae; }
.decision-watershed-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; min-height: 52px; align-items: center; gap: 14px; padding: 0 14px; border-top: 1px solid var(--line); background: #f7f2e9; }
.decision-watershed-row span { display: flex; align-items: center; gap: 7px; color: #725b2f; font-size: 12px; font-weight: 700; }
.decision-watershed-row span svg { width: 15px; height: 15px; }
.decision-watershed-row strong { overflow: hidden; color: #3d3424; font-size: 17px; text-overflow: ellipsis; white-space: nowrap; }
.decision-level-matrix.is-stale .decision-watershed-row strong { color: #a6aaae; }
.decision-level-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.decision-level-group { overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: white; }
.decision-level-group header { display: flex; align-items: center; gap: 7px; padding: 11px 13px; font-size: 12px; font-weight: 700; }
.decision-level-group header svg { width: 16px; height: 16px; }
.decision-level-group.resistance header { color: #b94d55; background: #fff1f2; }
.decision-level-group.support header { color: #23715e; background: #edf8f4; }
.decision-level-group > div { display: flex; align-items: center; justify-content: space-between; min-height: 47px; padding: 0 13px; border-top: 1px solid #edf0f1; }
.decision-level-group b { color: var(--muted); font-size: 12px; }
.decision-level-group strong { font-size: 16px; }
.decision-trade-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.decision-trade-grid article { overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: white; }
.decision-trade-grid article header { display: flex; align-items: center; gap: 6px; padding: 11px 13px; font-size: 12px; font-weight: 700; }
.decision-trade-grid article header svg { width: 15px; height: 15px; }
.decision-trade-grid .long header { color: #23715e; background: #edf8f4; }
.decision-trade-grid .short header { color: #b94d55; background: #fff1f2; }
.decision-trade-grid dl { margin: 0; }
.decision-trade-grid dl div { display: flex; justify-content: space-between; gap: 10px; padding: 11px 13px; border-top: 1px solid #edf0f1; }
.decision-trade-grid dt { color: var(--muted); font-size: 11px; }
.decision-trade-grid dd { margin: 0; font-size: 13px; font-weight: 700; }
.decision-exit { margin-top: 12px; padding: 14px; border: 1px solid var(--line); border-radius: 8px; background: white; }
.decision-exit span { color: var(--muted); font-size: 11px; }
.decision-exit p { margin: 7px 0 0; font-size: 13px; line-height: 1.7; white-space: pre-wrap; }
.decision-empty { display: flex; min-height: 220px; align-items: center; justify-content: center; gap: 8px; color: var(--muted); }
.decision-empty svg { width: 18px; animation: spin 1s linear infinite; }

.decision-editor-modal { width: min(720px, calc(100vw - 24px)); }
.decision-editor-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; max-height: 62vh; overflow-y: auto; padding: 2px 2px 8px; }
.decision-editor-wide, .decision-watershed-field, .decision-plan-fieldset { grid-column: 1 / -1; }
.decision-level-fieldset, .decision-plan-fieldset { min-width: 0; margin: 0; padding: 13px; border: 1px solid var(--line); border-radius: 8px; }
.decision-level-fieldset legend, .decision-plan-fieldset legend { padding: 0 6px; color: var(--muted); font-size: 11px; font-weight: 700; }
.decision-level-inputs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.decision-plan-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.decision-plan-grid textarea { grid-column: 1 / -1; }

.network-status {
  position: fixed;
  z-index: 100;
  top: max(10px, env(safe-area-inset-top));
  left: 50%;
  display: flex;
  width: min(430px, calc(100vw - 24px));
  min-height: 44px;
  align-items: center;
  gap: 9px;
  padding: 8px 10px 8px 12px;
  border: 1px solid #e5c391;
  border-radius: 8px;
  color: #6e4817;
  background: #fff8ec;
  box-shadow: 0 6px 20px rgba(30, 35, 40, 0.14);
  transform: translateX(-50%);
  font-size: 12px;
}

.network-status[hidden] { display: none; }
.network-status svg { width: 17px; height: 17px; flex: 0 0 auto; }
.network-status span { min-width: 0; flex: 1; }
.network-status button { height: 28px; padding: 0 10px; border: 0; border-radius: 6px; color: white; background: #8d5b1c; font-size: 11px; font-weight: 700; cursor: pointer; }

.group-join-requests .member-heading { margin-bottom: 8px; }
.join-request-row { display: flex; min-width: 0; align-items: center; gap: 9px; padding: 9px 0; border-top: 1px solid var(--line); }
.join-request-row:first-child { border-top: 0; }
.join-request-row .request-actions { margin-left: auto; }

.decision-history-modal { width: min(680px, calc(100vw - 24px)); }
.decision-history-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin-bottom: 12px; padding: 4px; border-radius: 8px; background: #e9ecee; }
.decision-history-tabs button { height: 34px; border: 0; border-radius: 6px; color: var(--muted); background: transparent; font-size: 12px; font-weight: 700; cursor: pointer; }
.decision-history-tabs button.active { color: var(--ink); background: white; box-shadow: 0 1px 3px rgba(20, 28, 36, 0.1); }
.decision-history-list { display: flex; max-height: 65vh; flex-direction: column; gap: 10px; overflow-y: auto; }
.decision-history-card { padding: 13px; border: 1px solid var(--line); border-radius: 8px; background: white; }
.decision-history-card header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.decision-history-card header div { min-width: 0; }
.decision-history-card header strong, .decision-history-card header span { display: block; }
.decision-history-card header strong { font-size: 14px; }
.decision-history-card header span, .decision-history-card header small { color: var(--muted); font-size: 10px; }
.decision-history-meta { display: flex; align-items: flex-end; flex-direction: column; gap: 5px; }
.decision-history-meta button { height: 25px; padding: 0 8px; border: 1px solid #bad9d0; border-radius: 5px; color: #246b5b; background: #edf7f4; font-size: 9px; font-weight: 700; cursor: pointer; }
.decision-history-card p { display: -webkit-box; overflow: hidden; margin: 10px 0; color: #3d454c; font-size: 12px; line-height: 19px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.decision-history-levels { display: grid; grid-template-columns: repeat(7, 1fr); gap: 5px; }
.decision-history-levels span { padding: 7px 5px; border-radius: 6px; color: var(--muted); background: #f2f4f5; font-size: 9px; text-align: center; }
.decision-history-levels b { display: block; overflow: hidden; margin-top: 2px; color: var(--ink); font-size: 11px; text-overflow: ellipsis; }
.decision-audit-row { display: flex; align-items: center; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: white; }
.decision-audit-icon { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border-radius: 7px; color: #246b5b; background: #e8f4f0; }
.decision-audit-icon svg { width: 16px; height: 16px; }
.decision-audit-row strong, .decision-audit-row small { display: block; }
.decision-audit-row strong { font-size: 12px; }
.decision-audit-row small { margin-top: 3px; color: var(--muted); font-size: 10px; }

.jin10-mark {
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 8px;
  color: white;
  background: #1f252b;
  font-size: 17px;
  font-weight: 700;
}

.jin10-heading {
  min-width: 0;
  flex: 1;
}

.jin10-heading h2,
.jin10-heading p {
  margin: 0;
}

.jin10-heading h2 {
  font-size: 16px;
  line-height: 23px;
}

.jin10-heading p {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  line-height: 17px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.jin10-refresh {
  background: #eef0f2;
}

.jin10-header-quote {
  display:grid;
  min-width:86px;
  justify-items:end;
  gap:2px;
  padding:7px 9px;
  border-radius:7px;
  color:#fff;
  background:#303533;
  font-variant-numeric:tabular-nums;
}
.jin10-header-quote[hidden] { display:none; }
.jin10-header-quote small { font-size:9px; line-height:1; }
.jin10-header-price { color:#fff; font-size:17px; line-height:1.1; letter-spacing:0; }
.jin10-header-price.tone-positive { color:#ff6872; }
.jin10-header-price.tone-negative { color:#65c9ae; }
.jin10-header-price.tone-neutral { color:#fff; }

.jin10-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  margin: 14px 18px 0;
  padding: 4px;
  border-radius: 8px;
  background: #e9ecee;
}

.jin10-tab,
.week-switch button {
  border: 0;
  border-radius: 6px;
  color: #6d747b;
  background: transparent;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.jin10-tab {
  height: 36px;
}

.jin10-tab.active,
.week-switch button.active {
  color: var(--ink);
  background: white;
  box-shadow: 0 1px 3px rgba(20, 28, 36, 0.1);
}

.calendar-toolbar {
  display: flex;
  min-height: 54px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 18px;
  border-bottom: 1px solid #e4e7e9;
}

.calendar-toolbar[hidden] {
  display: none;
}

.calendar-toolbar > span {
  color: var(--muted);
  font-size: 11px;
}

.week-switch {
  display: grid;
  width: 128px;
  grid-template-columns: 1fr 1fr;
  gap: 3px;
  padding: 3px;
  border-radius: 8px;
  background: #e4e7e9;
}

.week-switch button {
  height: 30px;
}

.jin10-content {
  min-height: 0;
  flex: 1;
  overflow-y: auto;
  padding: 0 18px 24px;
}

.jin10-loading,
.jin10-empty {
  display: flex;
  min-height: 220px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: var(--muted);
  font-size: 12px;
}

.jin10-loading svg {
  width: 18px;
  height: 18px;
}

.calendar-list,
.jin10-news-list {
  display: flex;
  flex-direction: column;
}

.calendar-row {
  display: grid;
  grid-template-columns: 58px 42px minmax(0, 1fr);
  gap: 10px;
  padding: 16px 0;
  border-bottom: 1px solid #e1e5e7;
}

.calendar-time {
  color: #646c73;
  font-size: 11px;
  line-height: 18px;
  white-space: pre-line;
}

.calendar-star {
  display: grid;
  width: 38px;
  height: 24px;
  place-items: center;
  border-radius: 6px;
  color: white;
  font-size: 11px;
  font-weight: 700;
}

.calendar-star.star-5 {
  background: var(--coral);
}

.calendar-star.star-4 {
  color: #47320c;
  background: var(--warm);
}

.calendar-copy {
  min-width: 0;
}

.calendar-title-line {
  display: flex;
  align-items: flex-start;
  gap: 7px;
}

.calendar-title-line strong {
  min-width: 0;
  flex: 1;
  font-size: 13px;
  line-height: 20px;
}

.calendar-affect {
  flex: 0 0 auto;
  padding: 2px 6px;
  border-radius: 5px;
  color: var(--accent-strong);
  background: var(--accent-soft);
  font-size: 9px;
}

.calendar-values {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 9px;
}

.calendar-value span,
.calendar-value strong {
  display: block;
}

.calendar-value span {
  color: #8a9198;
  font-size: 9px;
}

.calendar-value strong {
  overflow: hidden;
  margin-top: 2px;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.jin10-news-item {
  width: 100%;
  padding: 17px 0;
  border-bottom: 1px solid #e1e5e7;
  border-top: 0;
  border-right: 0;
  border-left: 0;
  color: var(--ink);
  text-align: left;
  background: transparent;
  cursor: pointer;
}

.jin10-news-item:hover,
.jin10-news-item:focus-visible {
  background: #eef1f2;
  outline: none;
}

.jin10-news-head {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.jin10-news-head h3 {
  display: -webkit-box;
  overflow: hidden;
  min-width: 0;
  flex: 1;
  margin: 0;
  font-size: 14px;
  line-height: 21px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.jin10-news-link {
  display: grid;
  width: 32px;
  height: 32px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 7px;
  color: #626a72;
  background: #e8ebed;
}

.jin10-news-item:hover .jin10-news-link,
.jin10-news-item:focus-visible .jin10-news-link {
  color: white;
  background: var(--accent);
}

.jin10-news-link svg {
  width: 15px;
  height: 15px;
}

.jin10-news-summary {
  display: -webkit-box;
  overflow: hidden;
  margin: 8px 0 0;
  color: #626a72;
  font-size: 12px;
  line-height: 19px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.jin10-news-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
  color: #8a9198;
  font-size: 10px;
}

.jin10-topic {
  padding: 3px 6px;
  border-radius: 5px;
  color: #4d5861;
  background: #e5e9eb;
}

.account-copy {
  min-width: 0;
  flex: 1;
}

.account-copy strong {
  display: block;
  overflow: hidden;
  margin-bottom: 2px;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.account-copy button {
  display: flex;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  padding: 0;
  border: 0;
  color: var(--muted);
  background: transparent;
  font-size: 11px;
  cursor: pointer;
}

.account-copy button svg {
  width: 12px;
  height: 12px;
}

.conversation-item {
  position: relative;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  gap: 12px;
  width: 100%;
  min-height: 76px;
  padding: 14px;
  border: 0;
  border-radius: 8px;
  text-align: left;
  background: transparent;
  cursor: pointer;
}

.conversation-item:hover {
  background: #faf2f3;
}

.conversation-item.active {
  background: var(--coral-soft);
}

.conversation-item.active::before {
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: 0;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: var(--coral);
  content: "";
}

.avatar {
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  color: #ffffff;
  background: #4b5563;
  font-size: 15px;
  font-weight: 700;
}

.avatar.group-avatar {
  color: #5b4213;
  background: var(--warm);
}

.conversation-copy {
  min-width: 0;
  align-self: center;
}

.conversation-copy strong,
.conversation-copy span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.conversation-copy strong {
  margin-bottom: 5px;
  font-size: 14px;
  line-height: 20px;
}

.conversation-title-line {
  display: flex !important;
  align-items: center;
  gap: 6px;
}

.conversation-title-line strong {
  min-width: 0;
  margin: 0;
}

.conversation-type {
  display: inline-grid !important;
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 5px;
  color: #725315 !important;
  background: #fff0c7;
  font-size: 9px !important;
  line-height: 18px !important;
}

.conversation-pin {
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
  color: var(--coral);
}

.conversation-muted {
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
  color: #8a919a;
}

.conversation-copy span {
  color: var(--muted);
  font-size: 12px;
  line-height: 18px;
}

.conversation-side {
  display: flex;
  align-items: flex-end;
  flex-direction: column;
  gap: 10px;
  padding-top: 2px;
}

.conversation-time {
  color: #969ca4;
  font-size: 11px;
}

.unread-badge {
  display: grid;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  place-items: center;
  border-radius: 10px;
  color: white;
  background: var(--coral);
  font-size: 10px;
  font-weight: 700;
}

.chat-pane {
  display: grid;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  grid-template-rows: auto auto auto 1fr auto;
  background: var(--canvas);
}

.chat-header {
  grid-row: 1;
}

.announcement-banner {
  grid-row: 2;
}

.mute-banner {
  grid-row: 3;
}

.chat-empty,
.message-stream {
  grid-row: 4;
}

.composer {
  grid-row: 5;
}

.chat-header {
  min-height: 80px;
  padding: 14px 24px;
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.96);
}

.chat-header .avatar {
  width: 44px;
  height: 44px;
}

#pinConversationButton.active {
  color: var(--coral-strong);
  background: var(--coral-soft);
}

.chat-heading {
  min-width: 0;
  flex: 1;
  margin-left: 12px;
}

.chat-heading h2 {
  overflow: hidden;
  font-size: 15px;
  line-height: 22px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-heading p {
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  line-height: 18px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mobile-back {
  display: none;
  margin-right: 8px;
}

.mute-banner {
  display: flex;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 20px;
  color: #725315;
  background: #fff5db;
  font-size: 12px;
}

.mute-banner[hidden] {
  display: none;
}

.announcement-banner {
  display: grid;
  min-height: 42px;
  grid-template-columns: 18px minmax(0, 1fr) 16px;
  align-items: center;
  gap: 8px;
  padding: 8px clamp(18px, 4vw, 64px);
  border: 0;
  border-bottom: 1px solid #f0dfb6;
  color: #725315;
  background: #fff9e9;
  text-align: left;
  cursor: pointer;
}

.announcement-banner span {
  overflow: hidden;
  font-size: 12px;
  line-height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.announcement-banner svg {
  width: 16px;
  height: 16px;
}

.chat-empty {
  display: flex;
  min-height: 0;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 12px;
  color: var(--muted);
}

.chat-empty strong {
  font-size: 13px;
  font-weight: 600;
}

.empty-mark {
  display: grid;
  width: 52px;
  height: 52px;
  place-items: center;
  border: 1px solid #dfe3e7;
  border-radius: 50%;
  background: white;
}

.empty-mark svg {
  width: 22px;
  height: 22px;
}

.message-stream {
  min-height: 0;
  overflow-y: auto;
  padding: 30px clamp(18px, 4vw, 64px) 20px;
  background: #f6f7f8;
}

.date-divider {
  margin: 2px 0 24px;
  color: #8a919a;
  text-align: center;
  font-size: 11px;
}

.system-message {
  width: fit-content;
  max-width: 80%;
  margin: 8px auto 20px;
  padding: 7px 11px;
  border-radius: 8px;
  color: #727981;
  background: #e9ecef;
  font-size: 11px;
  text-align: center;
}

.strategy-alert-message {
  width: min(88%, 460px);
  margin: 8px auto 18px;
  overflow: hidden;
  border: 1px solid #b9ddd5;
  border-left: 4px solid #168372;
  border-radius: 7px;
  color: #183e38;
  background: #f1faf7;
  box-shadow: 0 6px 18px rgba(30, 91, 79, 0.08);
}

.strategy-alert-message > header,
.strategy-alert-message > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 12px;
}

.strategy-alert-message > header { border-bottom: 1px solid rgba(35, 112, 98, 0.13); }
.strategy-alert-message > header span { display: flex; align-items: center; gap: 6px; color: #147261; font-size: 10px; font-weight: 800; }
.strategy-alert-message > header svg { width: 14px; height: 14px; }
.strategy-alert-message > header time { color: #6f8983; font-size: 9px; }
.strategy-alert-message h3 { margin: 12px 12px 5px; font-size: 14px; line-height: 20px; }
.strategy-alert-message p { margin: 0 12px 10px; color: #31534d; font-size: 12px; line-height: 1.65; }
.strategy-alert-message > small { display: block; margin: 0 12px 11px; padding: 8px 9px; border-left: 2px solid #6aa99d; color: #6a7672; background: rgba(255, 255, 255, 0.66); font-size: 9px; line-height: 1.55; }
.strategy-alert-message > footer { border-top: 1px solid rgba(35, 112, 98, 0.13); color: #55706a; font-size: 9px; }
.strategy-alert-message > footer b { font-weight: 700; }
.strategy-alert-message > footer strong { color: #126f5f; font-size: 13px; font-variant-numeric: tabular-nums; }
.strategy-alert-message.event-profit { border-color: #ead497; border-left-color: #c49527; color: #584719; background: #fff9e8; }
.strategy-alert-message.event-profit > header,
.strategy-alert-message.event-profit > footer { border-color: rgba(154, 111, 18, 0.16); }
.strategy-alert-message.event-profit > header span,
.strategy-alert-message.event-profit > footer strong { color: #8f6814; }
.strategy-alert-message.event-target_1,
.strategy-alert-message.event-target_2,
.strategy-alert-message.event-target_3 { border-color: #bddcc8; border-left-color: #278551; background: #f1faf4; }
.strategy-alert-message.event-stop,
.strategy-alert-message.event-invalid_reentry { border-color: #edc2c6; border-left-color: #c6535d; color: #5b2a2f; background: #fff4f5; }
.strategy-alert-message.event-stop > header,
.strategy-alert-message.event-stop > footer,
.strategy-alert-message.event-invalid_reentry > header,
.strategy-alert-message.event-invalid_reentry > footer { border-color: rgba(161, 58, 67, 0.15); }
.strategy-alert-message.event-stop > header span,
.strategy-alert-message.event-stop > footer strong,
.strategy-alert-message.event-invalid_reentry > header span,
.strategy-alert-message.event-invalid_reentry > footer strong { color: #a83f49; }

.message-time-divider {
  display: flex;
  justify-content: center;
  margin: 8px 0 18px;
  pointer-events: none;
}

.message-time-divider time {
  padding: 4px 8px;
  border-radius: 5px;
  color: #737a82;
  background: rgba(226, 230, 233, 0.94);
  font-size: 11px;
  line-height: 16px;
}

.message-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 16px;
}

.message-row.outgoing {
  justify-content: flex-end;
}

.message-avatar {
  display: grid;
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 8px;
  color: white;
  font-size: 11px;
  font-weight: 700;
}

.message-row.group-message .message-avatar {
  margin-top: 22px;
}

.message-column {
  display: flex;
  max-width: min(72%, 600px);
  align-items: flex-start;
  flex-direction: column;
}

.outgoing .message-column {
  align-items: flex-end;
}

.sender-name {
  margin: 0 0 5px 2px;
  color: #7d848c;
  font-size: 11px;
}

.message-bubble {
  padding: 10px 13px;
  border: 1px solid #e8ecef;
  border-radius: 8px;
  color: var(--ink);
  background: white;
  box-shadow: 0 1px 2px rgba(24, 31, 38, 0.04);
  font-size: 14px;
  line-height: 22px;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.message-bubble.image-bubble {
  overflow: hidden;
  padding: 0;
  background: white;
}

.message-bubble.image-bubble.has-reply {
  padding: 8px;
}

.message-bubble.image-bubble.has-reply .message-image-link,
.message-bubble.image-bubble.has-reply .message-image {
  border-radius: 5px;
}

.message-bubble.attachment-bubble {
  min-width: min(280px, 62vw);
  padding: 9px 11px;
}

.outgoing .message-bubble.attachment-bubble {
  border-color: #e8ecef;
  color: var(--ink);
  background: white;
}

.voice-message {
  display: flex;
  width: min(var(--voice-width, 128px), 54vw);
  min-height: 40px;
  align-items: center;
  gap: 9px;
  padding: 0 4px;
  border: 0;
  color: var(--ink);
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.voice-message > svg {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  color: var(--coral-strong);
}

.voice-message span {
  flex: 1;
  color: #596168;
  font-size: 12px;
  font-weight: 700;
}

.voice-message audio {
  display: none;
}

.voice-message.playing > svg {
  animation: voice-playing 900ms ease-in-out infinite;
}

.voice-message.loading > svg {
  animation: voice-playing 500ms ease-in-out infinite;
}

.voice-message.playing span {
  color: var(--coral-strong);
}

@keyframes voice-playing {
  50% { opacity: 0.35; }
}

.file-message {
  display: grid;
  min-width: 0;
  grid-template-columns: 34px minmax(0, 1fr) 20px;
  align-items: center;
  gap: 9px;
  color: var(--ink);
  text-decoration: none;
}

.file-message > svg:first-child {
  width: 32px;
  height: 32px;
  padding: 6px;
  border-radius: 7px;
  color: #725315;
  background: #fff0c7;
}

.file-message > svg:last-child {
  width: 18px;
  height: 18px;
  color: var(--muted);
}

.file-message span,
.file-message strong,
.file-message small {
  display: block;
  min-width: 0;
}

.file-message strong {
  overflow: hidden;
  max-width: 100%;
  font-size: 12px;
  line-height: 18px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.file-message small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
  line-height: 15px;
}

.message-image-link {
  display: block;
  padding: 0;
  border: 0;
  background: transparent;
  line-height: 0;
  cursor: zoom-in;
}

.message-image {
  display: block;
  width: auto;
  height: auto;
  max-width: min(320px, 68vw);
  max-height: 380px;
  object-fit: contain;
}

.outgoing .message-bubble {
  border-color: transparent;
  color: white;
  background: var(--accent);
}

.outgoing .message-bubble.image-bubble {
  border-color: #e8ecef;
  background: white;
}

.message-reply-quote {
  display: block;
  width: 100%;
  margin-bottom: 8px;
  padding: 7px 9px;
  border: 0;
  border-left: 3px solid #9aa1a8;
  border-radius: 4px;
  color: #596168;
  background: #f0f2f3;
  text-align: left;
  cursor: pointer;
}

.message-reply-quote strong,
.message-reply-quote span {
  display: block;
  overflow: hidden;
  font-size: 10px;
  line-height: 16px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.outgoing .message-reply-quote {
  border-left-color: rgba(255, 255, 255, 0.7);
  color: white;
  background: rgba(0, 0, 0, 0.13);
}

.message-mention {
  padding: 0 2px;
  border-radius: 3px;
  color: var(--coral-strong);
  background: var(--coral-soft);
  font-weight: 700;
}

.outgoing .message-mention {
  color: white;
  background: rgba(255, 255, 255, 0.18);
}

.unread-divider {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 8px 0 20px;
  color: var(--coral-strong);
  font-size: 11px;
}

.unread-divider::before,
.unread-divider::after {
  height: 1px;
  flex: 1;
  background: #efc6c9;
  content: "";
}

.message-row.jump-highlight .message-bubble {
  animation: message-highlight 1.2s ease;
}

@keyframes message-highlight {
  0%, 100% { box-shadow: 0 1px 2px rgba(24, 31, 38, 0.06); }
  30% { box-shadow: 0 0 0 4px rgba(223, 91, 99, 0.28); }
}

.message-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 22px;
  margin-top: 3px;
  color: #8a919a;
  font-size: 10px;
}

.incoming .message-meta {
  margin-left: 2px;
}

.outgoing .message-meta {
  justify-content: flex-end;
}

.message-action-button {
  display: grid;
  width: 22px;
  height: 22px;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 6px;
  color: #7f878f;
  background: transparent;
  cursor: pointer;
}

.message-action-button:hover {
  color: var(--ink);
  background: #e7eaec;
}

.message-action-button svg {
  width: 15px;
  height: 15px;
}

.receipt-button {
  padding: 0;
  border: 0;
  color: var(--accent-strong);
  background: transparent;
  font-size: 10px;
  cursor: pointer;
}

.delivery-state {
  color: #8a919a;
}

.delivery-state.failed {
  padding: 0;
  border: 0;
  color: var(--danger);
  background: transparent;
  font-size: 10px;
  cursor: pointer;
}

.composer {
  display: grid;
  grid-template-columns: 40px 40px 40px minmax(0, 1fr) 44px;
  align-items: end;
  gap: 8px;
  padding: 16px clamp(18px, 4vw, 64px) 20px;
  border-top: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.96);
}

.reply-composer,
.mention-picker {
  grid-column: 1 / -1;
}

.reply-composer {
  display: grid;
  min-height: 48px;
  grid-template-columns: 20px minmax(0, 1fr) 32px;
  align-items: center;
  gap: 8px;
  padding: 7px 8px 7px 12px;
  border-left: 3px solid var(--accent);
  border-radius: 7px;
  color: var(--accent-strong);
  background: var(--accent-soft);
}

.reply-composer > svg {
  width: 17px;
  height: 17px;
}

.reply-composer > span,
.reply-composer strong,
.reply-composer small {
  display: block;
  min-width: 0;
}

.reply-composer strong {
  font-size: 11px;
}

.reply-composer small {
  overflow: hidden;
  margin-top: 2px;
  color: #657078;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.reply-composer .icon-button {
  width: 30px;
  height: 30px;
}

.mention-picker {
  max-height: 180px;
  overflow-y: auto;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  box-shadow: 0 8px 24px rgba(20, 28, 36, 0.14);
}

.mention-option {
  display: flex;
  width: 100%;
  min-height: 42px;
  align-items: center;
  gap: 9px;
  padding: 5px 8px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.mention-option:hover {
  background: #f4f6f7;
}

.mention-option .small-avatar {
  width: 28px;
  height: 28px;
}

.image-upload-button {
  width: 40px;
  height: 44px;
  color: #697179;
  background: #eef0f2;
}

.image-upload-button:hover {
  background: #e3e7e9;
}

.composer-tool-button {
  width: 40px;
  height: 44px;
  color: #697179;
  background: #eef0f2;
}

.composer-tool-button:hover {
  background: #e3e7e9;
}

.voice-hold-button {
  display: flex;
  min-width: 0;
  height: 44px;
  grid-column: 4 / 6;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  background: white;
  font-weight: 700;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
  cursor: pointer;
}

.voice-hold-button[hidden] {
  display: none;
}

.voice-hold-button:active,
.voice-hold-button.recording {
  color: white;
  border-color: var(--accent);
  background: var(--accent);
}

.voice-hold-button.canceling {
  border-color: var(--danger);
  background: var(--danger);
}

.composer.voice-mode > textarea,
.composer.voice-mode > .send-button {
  display: none;
}

.composer textarea {
  width: 100%;
  min-height: 44px;
  max-height: 132px;
  padding: 10px 16px;
  overflow-y: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  background: white;
  font: inherit;
  line-height: 22px;
  resize: none;
}

.composer textarea:disabled {
  color: #999fa7;
  background: #eef0f2;
}

.send-button {
  width: 44px;
  height: 44px;
  color: white;
  background: var(--accent);
}

.send-button:hover {
  background: var(--accent-strong);
}

.settings-drawer {
  position: absolute;
  z-index: 5;
  top: 0;
  right: 0;
  display: flex;
  width: min(380px, 100%);
  height: 100%;
  min-height: 0;
  flex-direction: column;
  overflow: hidden;
  border-left: 1px solid var(--line);
  background: white;
  box-shadow: -18px 0 40px rgba(21, 24, 29, 0.12);
  transform: translateX(105%);
  transition: transform 180ms ease;
}

.settings-drawer.open {
  transform: translateX(0);
}

.drawer-scrim {
  position: absolute;
  z-index: 4;
  inset: 0;
  display: none;
  width: 100%;
  height: 100%;
  border: 0;
  background: rgba(21, 24, 29, 0.28);
}

.drawer-scrim.open {
  display: block;
}

.drawer-header {
  min-height: 88px;
  flex: 0 0 auto;
  justify-content: space-between;
  padding: 18px 20px;
  border-bottom: 1px solid var(--line);
}

.drawer-header h2,
.modal-header h2 {
  font-size: 18px;
  line-height: 26px;
}

.drawer-content {
  min-height: 0;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  padding: 22px 20px calc(22px + env(safe-area-inset-bottom));
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
}

.setting-section {
  padding-bottom: 22px;
  border-bottom: 1px solid var(--line);
}

.setting-section + .setting-section {
  padding-top: 22px;
}

.setting-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.setting-copy strong,
.setting-copy span {
  display: block;
}

.setting-copy strong {
  margin-bottom: 4px;
  font-size: 14px;
}

.setting-copy span {
  color: var(--muted);
  font-size: 12px;
  line-height: 18px;
}

.switch {
  position: relative;
  display: inline-block;
  width: 46px;
  height: 26px;
  flex: 0 0 auto;
}

.switch input {
  position: absolute;
  opacity: 0;
}

.switch-track {
  position: absolute;
  inset: 0;
  border-radius: 13px;
  background: #c8cdd2;
  cursor: pointer;
  transition: background 160ms ease;
}

.switch-track::after {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: white;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
  content: "";
  transition: transform 160ms ease;
}

.switch input:checked + .switch-track {
  background: var(--coral);
}

.switch input:checked + .switch-track::after {
  transform: translateX(20px);
}

.member-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 22px 0 12px;
}

.member-heading h3 {
  font-size: 14px;
}

.member-heading span {
  color: var(--muted);
  font-size: 12px;
}

.member-heading-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.mini-icon-button {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 7px;
  color: var(--accent-strong);
  background: white;
  cursor: pointer;
}

.mini-icon-button:hover {
  color: white;
  border-color: var(--accent);
  background: var(--accent);
}

.mini-icon-button svg {
  width: 16px;
  height: 16px;
}

.member-row,
.picker-row,
.receipt-row {
  display: flex;
  align-items: center;
  gap: 11px;
}

.member-row {
  min-height: 54px;
}

.member-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

.mini-icon-button.danger-icon {
  color: var(--danger);
}

.setting-command {
  display: grid;
  width: 100%;
  min-height: 54px;
  grid-template-columns: 20px minmax(0, 1fr) 16px;
  align-items: center;
  gap: 10px;
  padding: 0;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.setting-command > svg {
  width: 18px;
  height: 18px;
  color: var(--accent-strong);
}

.setting-command span,
.setting-command strong,
.setting-command small {
  display: block;
}

.setting-command strong {
  font-size: 13px;
}

.setting-command small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
}

.mini-icon-button.danger-icon:hover {
  border-color: var(--danger);
  background: var(--danger);
}

.small-avatar {
  display: grid;
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  color: white;
  font-size: 11px;
  font-weight: 700;
}

.member-copy {
  min-width: 0;
  flex: 1;
}

.member-copy strong,
.member-copy span {
  display: block;
}

.member-copy strong {
  font-size: 13px;
}

.member-copy span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
}

.role-tag {
  padding: 4px 7px;
  border-radius: 6px;
  color: #725315;
  background: #fff2cf;
  font-size: 10px;
}

.role-tag.admin-role {
  color: var(--accent-strong);
  background: var(--accent-soft);
}

.modal {
  width: min(500px, calc(100vw - 28px));
  max-height: min(720px, calc(100vh - 28px));
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 8px;
  background: white;
  box-shadow: var(--shadow);
}

.modal::backdrop {
  background: rgba(15, 20, 26, 0.48);
}

.modal form {
  display: flex;
  max-height: min(720px, calc(100vh - 28px));
  flex-direction: column;
}

.modal-header {
  min-height: 86px;
  justify-content: space-between;
  padding: 18px 22px;
  border-bottom: 1px solid var(--line);
}

.field-group,
.modal fieldset {
  margin: 0;
  padding: 20px 22px 0;
  border: 0;
}

.modal textarea {
  width: 100%;
  padding: 12px;
  resize: vertical;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  background: #fbfcfd;
  font: inherit;
  font-size: 13px;
  line-height: 21px;
}

.modal textarea:focus-visible {
  outline: 3px solid rgba(223, 91, 99, 0.2);
  outline-offset: 2px;
}

.field-group label,
.modal legend {
  display: block;
  margin-bottom: 9px;
  padding: 0;
  font-size: 12px;
  font-weight: 700;
}

.field-group input {
  height: 44px;
  padding: 0 13px;
}

.member-picker {
  max-height: 250px;
  overflow-y: auto;
  border-top: 1px solid var(--line);
}

.picker-row {
  min-height: 58px;
  padding: 8px 2px;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
}

.picker-row input {
  width: 18px;
  height: 18px;
  margin-left: auto;
  accent-color: var(--accent);
}

.form-error {
  min-height: 18px;
  margin: 10px 22px 0;
  color: var(--danger);
  font-size: 11px;
}

.inline-field {
  padding-bottom: 4px;
}

.input-action-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
}

.search-result {
  min-height: 72px;
  padding: 8px 22px 0;
}

.search-user-row,
.contact-row {
  display: flex;
  min-height: 58px;
  align-items: center;
  gap: 11px;
}

.relation-label {
  color: var(--muted);
  font-size: 11px;
}

.compact-button,
.mini-button {
  min-width: 72px;
  height: 34px;
  padding: 0 12px;
}

.request-actions {
  display: flex;
  gap: 7px;
}

.request-actions .mini-button {
  min-width: 54px;
  padding: 0 8px;
}

.mini-button.secondary-mini {
  color: var(--muted);
  border-color: var(--line);
  background: white;
}

.mini-button {
  border: 1px solid var(--accent);
  border-radius: 8px;
  color: white;
  background: var(--accent);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.contact-section {
  padding: 0 22px 10px;
}

.contact-friends {
  max-height: 320px;
  overflow-y: auto;
  border-top: 1px solid var(--line);
}

.contacts-pane .contact-friends {
  max-height: none;
}

.contact-row {
  border-bottom: 1px solid var(--line);
}

.contact-button {
  width: 100%;
  padding: 0;
  border: 0;
  text-align: left;
  background: transparent;
  cursor: pointer;
}

.contact-button:hover {
  background: #f7f8f9;
}

.contact-button > svg {
  width: 18px;
  height: 18px;
  color: var(--muted);
}

.small-empty {
  padding: 20px 8px;
}

.message-empty {
  padding-top: 80px;
}

.modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 16px 22px 20px;
}

.primary-button,
.secondary-button {
  min-width: 88px;
  height: 40px;
  padding: 0 16px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.danger-button {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 16px;
  border: 1px solid var(--danger);
  border-radius: 8px;
  color: white;
  background: var(--danger);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.danger-button svg,
.full-action-button svg,
.drawer-danger-actions svg {
  width: 16px;
  height: 16px;
}

.drawer-danger-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 24px;
}

.drawer-danger-actions button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
}

.action-list {
  display: grid;
  padding: 10px 18px 18px;
}

.action-list button,
.profile-setting-button {
  display: flex;
  min-height: 50px;
  align-items: center;
  gap: 12px;
  padding: 0 10px;
  border: 0;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  background: white;
  font-size: 13px;
  text-align: left;
  cursor: pointer;
}

.action-list button:last-child,
.profile-setting-button:last-child {
  border-bottom: 0;
}

.action-list button svg,
.profile-setting-button svg {
  width: 18px;
  height: 18px;
}

.action-list .danger-text {
  color: var(--danger);
}

.search-message-field {
  margin: 20px 22px 0;
  padding: 0;
}

.search-message-results {
  min-height: 120px;
  max-height: 420px;
  overflow-y: auto;
  padding: 12px 22px 22px;
}

.search-message-result {
  padding: 13px 0;
  border-bottom: 1px solid var(--line);
}

.search-message-result > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 12px;
}

.search-message-result time {
  color: var(--muted);
}

.search-message-result p {
  margin: 6px 0 0;
  color: #4a5158;
  font-size: 13px;
  line-height: 20px;
  overflow-wrap: anywhere;
}

.direct-settings-content {
  padding: 22px;
}

.full-action-button {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 14px;
}

.direct-settings-content .setting-row {
  margin-bottom: 22px;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--line);
}

.account-fields {
  display: grid;
  gap: 9px;
}

.account-fields label:not(:first-child) {
  margin-top: 8px;
}

.blocked-users-list {
  max-height: 420px;
  overflow-y: auto;
  padding: 4px 22px 20px;
}

.primary-button {
  border: 1px solid var(--coral);
  color: white;
  background: var(--coral);
}

.secondary-button {
  border: 1px solid var(--line);
  background: white;
}

.input-action-row .secondary-button {
  border-color: var(--accent);
  color: white;
  background: var(--accent);
}

.modal.compact {
  width: min(420px, calc(100vw - 28px));
}

.jin10-detail-modal {
  width: min(620px, calc(100vw - 28px));
}

.jin10-detail-content {
  max-height: calc(100vh - 142px);
  overflow-y: auto;
  padding: 22px;
}

.jin10-detail-content h3 {
  margin: 0;
  font-size: 18px;
  line-height: 28px;
}

.jin10-detail-content .jin10-news-meta {
  margin-top: 12px;
}

.jin10-detail-body {
  margin-top: 20px;
  color: #3f474e;
  font-size: 14px;
  line-height: 24px;
  white-space: pre-wrap;
}

.jin10-detail-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 22px;
  color: var(--ink);
  text-decoration: none;
}

.jin10-detail-link[hidden] {
  display: none;
}

.jin10-detail-link svg {
  width: 16px;
  height: 16px;
}

.receipt-summary {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 18px 22px 10px;
}

.receipt-list {
  max-height: min(58vh, 480px);
  overflow-y: auto;
  padding: 0 22px 20px;
}

.receipt-summary-item {
  display: flex;
  min-height: 62px;
  align-items: baseline;
  justify-content: center;
  gap: 5px;
  padding: 14px 10px;
  border-radius: 8px;
  font-size: 12px;
}

.receipt-summary-item strong {
  font-size: 22px;
}

.receipt-summary-item.unread {
  color: #616971;
  background: #f1f3f4;
}

.receipt-summary-item.read {
  color: var(--accent-strong);
  background: var(--accent-soft);
}

.receipt-group + .receipt-group {
  margin-top: 18px;
}

.receipt-group-heading {
  display: flex;
  min-height: 38px;
  align-items: center;
  justify-content: space-between;
  padding: 0 12px;
  border-radius: 7px;
  color: #596168;
  background: #f4f5f6;
  font-size: 12px;
}

.receipt-group-heading span {
  color: var(--muted);
  font-size: 11px;
}

.read-group .receipt-group-heading {
  color: var(--accent-strong);
  background: var(--accent-soft);
}

.receipt-group-members {
  padding: 0 4px;
}

.receipt-empty {
  padding: 22px 12px;
  color: var(--muted);
  text-align: center;
  font-size: 12px;
}

.receipt-row {
  min-height: 54px;
  border-bottom: 1px solid var(--line);
}

.profile-content {
  display: flex;
  align-items: center;
  flex-direction: column;
  padding: 28px 24px 24px;
}

.profile-avatar {
  display: grid;
  width: 72px;
  height: 72px;
  place-items: center;
  border: 4px solid #fff;
  border-radius: 50%;
  color: white;
  box-shadow: 0 0 0 1px var(--line), 0 8px 22px rgba(83, 48, 53, 0.12);
  font-size: 22px;
  font-weight: 700;
}

.profile-content > strong {
  margin-top: 14px;
  font-size: 18px;
}

.profile-id {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
}

.profile-copy-button,
.profile-logout-button {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.image-preview-content {
  padding: 20px 22px 4px;
}

.image-preview-content img {
  display: block;
  width: 100%;
  max-height: min(52vh, 480px);
  border-radius: 8px;
  background: #eef1f2;
  object-fit: contain;
}

.image-preview-content p {
  overflow: hidden;
  margin: 10px 0 0;
  color: var(--muted);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.image-preview-modal[open] {
  display: grid;
  width: min(500px, calc(100vw - 20px));
  max-height: calc(var(--app-height, 100dvh) - 20px);
  grid-template-rows: auto minmax(0, 1fr) auto;
}

.image-preview-modal .modal-header {
  min-height: 64px;
  padding: 12px 16px;
}

.image-preview-modal .image-preview-content {
  min-height: 0;
  padding: 12px 16px 8px;
  overflow-y: auto;
}

.image-preview-modal .image-preview-content img {
  max-height: calc(var(--app-height, 100dvh) - 210px);
}

.image-preview-modal .modal-actions {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  padding: 10px 16px max(12px, env(safe-area-inset-bottom));
  border-top: 1px solid var(--line);
  background: var(--panel);
  box-shadow: 0 -5px 16px rgba(27, 37, 34, .06);
}

.image-preview-modal .modal-actions button {
  display: inline-flex;
  min-width: 0;
  flex: 1 1 0;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.image-preview-modal .modal-actions svg { width: 15px; height: 15px; }

.image-viewer-modal {
  width: 100vw;
  max-width: none;
  height: 100dvh;
  max-height: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: #050607;
}

.image-viewer-modal::backdrop {
  background: #050607;
}

.image-viewer-toolbar {
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: calc(12px + env(safe-area-inset-top)) 14px 12px;
  pointer-events: none;
}

.image-viewer-icon {
  display: grid;
  width: 42px;
  height: 42px;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: white;
  background: rgba(30, 34, 38, 0.72);
  backdrop-filter: blur(8px);
  cursor: pointer;
  pointer-events: auto;
}

.image-viewer-icon svg {
  width: 20px;
  height: 20px;
}

.image-viewer-content {
  display: grid;
  width: 100%;
  height: 100%;
  place-items: center;
  overflow: hidden;
  padding: max(18px, env(safe-area-inset-top)) 0 max(18px, env(safe-area-inset-bottom));
  background: #050607;
  cursor: default;
  touch-action: none;
  user-select: none;
  overscroll-behavior: contain;
}

.image-viewer-content img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  transform: translate3d(0, 0, 0) scale(1);
  transform-origin: center;
  will-change: transform;
  user-select: none;
  -webkit-user-drag: none;
}

.image-viewer-content img.animate {
  transition: transform 200ms ease-out;
}

.image-viewer-content.zoomed {
  cursor: grab;
}

.image-viewer-content.zoomed:active {
  cursor: grabbing;
}

.share-qr-content {
  display: flex;
  align-items: center;
  flex-direction: column;
  padding: 24px 22px 8px;
  text-align: center;
}

.share-qr-code {
  display: grid;
  width: 220px;
  height: 220px;
  place-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
}

.share-qr-code canvas,
.share-qr-code img {
  display: block;
  width: 200px;
  height: 200px;
}

.share-qr-content > strong {
  margin-top: 16px;
  font-size: 16px;
}

.share-qr-content > span {
  margin-top: 5px;
  color: var(--muted);
  font-size: 12px;
}

.profile-copy-button {
  margin-top: 24px;
}

.sound-settings {
  width: 100%;
  margin-top: 16px;
  padding: 14px 16px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
}

.background-message-settings {
  width: 100%;
  margin-top: 12px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
}

.background-message-header {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
}

.background-message-header > svg {
  width: 19px;
  height: 19px;
  color: var(--coral-strong);
}

.background-message-header div,
.background-message-header strong,
.background-message-header span {
  display: block;
  min-width: 0;
}

.background-message-header strong {
  font-size: 13px;
  line-height: 20px;
}

.background-message-header span {
  color: var(--muted);
  font-size: 10px;
  line-height: 16px;
}

.background-message-header span.enabled {
  color: var(--accent-strong);
}

.background-message-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 40px;
  gap: 8px;
  margin-top: 12px;
}

.background-message-actions .secondary-button {
  display: flex;
  height: 40px;
  align-items: center;
  justify-content: center;
  gap: 7px;
}

.background-message-actions .secondary-button svg,
.background-message-actions .icon-button svg {
  width: 17px;
  height: 17px;
}

.background-message-actions .icon-button {
  width: 40px;
  height: 40px;
  color: #697179;
  background: #eef0f2;
}

.sound-settings-header {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) 34px;
  align-items: center;
  gap: 9px;
  padding-bottom: 12px;
  border-bottom: 1px solid #eef0f2;
}

.sound-settings-header > svg {
  width: 19px;
  height: 19px;
  color: var(--accent);
}

.sound-settings-header div,
.sound-settings-header strong,
.sound-settings-header span {
  display: block;
  min-width: 0;
}

.sound-settings-header strong {
  font-size: 13px;
  line-height: 20px;
}

.sound-settings-header span {
  color: var(--muted);
  font-size: 10px;
  line-height: 16px;
}

.sound-preview-button {
  width: 34px;
  height: 34px;
  color: var(--accent-strong);
  background: var(--accent-soft);
}

.sound-setting-row,
.sound-volume-row {
  display: flex;
  width: 100%;
  color: #4d555d;
  font-size: 12px;
}

.sound-setting-row {
  min-height: 48px;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.sound-setting-row select {
  min-width: 112px;
  height: 36px;
  padding: 0 30px 0 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  color: var(--ink);
  background: white;
  font: inherit;
}

.sound-volume-row {
  flex-direction: column;
  gap: 8px;
  padding-top: 8px;
}

.sound-volume-row > span {
  display: flex;
  justify-content: space-between;
}

.sound-volume-row strong {
  color: var(--accent-strong);
  font-size: 11px;
}

.sound-volume-row input {
  width: 100%;
  accent-color: var(--accent);
}

.profile-settings-list {
  width: 100%;
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
}

.profile-setting-button {
  width: 100%;
  text-decoration: none;
}

.profile-setting-button span {
  flex: 1;
}

.profile-setting-button strong {
  color: var(--muted);
  font-size: 12px;
}

.release-notes {
  padding: 22px;
}

.release-notes > span {
  color: var(--muted);
  font-size: 12px;
}

.release-download-meta {
  margin: 10px 0 0;
  color: var(--text);
  font-size: 13px;
  font-weight: 700;
}

.release-notes ul {
  margin: 14px 0 0;
  padding-left: 20px;
}

.release-notes li {
  margin-bottom: 9px;
  color: #41484f;
  font-size: 13px;
  line-height: 20px;
}

.release-notes li:nth-child(n + 5) {
  display: none;
}

.profile-copy-button svg,
.profile-logout-button svg {
  width: 17px;
  height: 17px;
}

.profile-logout-button {
  height: 42px;
  margin-top: 10px;
  border: 0;
  border-radius: 8px;
  color: var(--coral-strong);
  background: var(--coral-soft);
  font-weight: 700;
  cursor: pointer;
}

.file-send-preview {
  display: grid;
  min-width: 0;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  margin: 18px 22px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f7f8f9;
}

.file-send-preview > svg {
  width: 40px;
  height: 40px;
  padding: 8px;
  border-radius: 7px;
  color: #725315;
  background: #fff0c7;
}

.file-send-preview span,
.file-send-preview strong,
.file-send-preview small {
  display: block;
  min-width: 0;
}

.file-send-preview strong {
  overflow: hidden;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.file-send-preview small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 11px;
}

.forward-conversation-list,
.favorites-list,
.login-devices-list {
  max-height: min(58vh, 520px);
  overflow-y: auto;
  padding: 8px 14px 14px;
}

.forward-conversation-row {
  display: grid;
  min-height: 62px;
  grid-template-columns: 20px 38px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 8px;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
}

.forward-conversation-row input {
  width: 18px;
  height: 18px;
  accent-color: var(--accent);
}

.forward-conversation-row .small-avatar {
  width: 38px;
  height: 38px;
}

.forward-conversation-row strong,
.forward-conversation-row small {
  display: block;
}

.forward-conversation-row strong {
  overflow: hidden;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.forward-conversation-row small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 10px;
}

.favorite-row,
.login-device-row {
  display: grid;
  min-height: 68px;
  align-items: center;
  gap: 10px;
  padding: 9px 6px;
  border-bottom: 1px solid var(--line);
}

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

.favorite-row > button:first-child {
  display: grid;
  min-width: 0;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 0;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.favorite-row strong,
.favorite-row small,
.favorite-row time {
  display: block;
  min-width: 0;
}

.favorite-row strong {
  font-size: 12px;
}

.favorite-row small {
  overflow: hidden;
  margin-top: 2px;
  color: #515961;
  font-size: 11px;
  line-height: 17px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.favorite-row time {
  margin-top: 2px;
  color: var(--muted);
  font-size: 9px;
}

.login-device-row {
  grid-template-columns: 40px minmax(0, 1fr) auto;
}

.device-icon {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 8px;
  color: var(--accent-strong);
  background: var(--accent-soft);
}

.device-icon svg {
  width: 19px;
  height: 19px;
}

.login-device-row strong,
.login-device-row small {
  display: block;
}

.login-device-row strong {
  font-size: 12px;
  line-height: 18px;
}

.login-device-row strong em {
  margin-left: 7px;
  padding: 2px 5px;
  border-radius: 4px;
  color: #16685f;
  background: #dff3ef;
  font-size: 9px;
  font-style: normal;
}

.login-device-row small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 10px;
  line-height: 16px;
}

.toast {
  position: fixed;
  z-index: 20;
  bottom: 24px;
  left: 50%;
  padding: 10px 14px;
  border-radius: 8px;
  color: white;
  background: var(--ink);
  box-shadow: 0 8px 24px rgba(20, 28, 36, 0.2);
  font-size: 12px;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 8px);
  transition: opacity 160ms ease, transform 160ms ease;
}

.toast.show {
  opacity: 1;
  transform: translate(-50%, 0);
}

.empty-state {
  padding: 44px 20px;
  color: var(--muted);
  text-align: center;
  font-size: 13px;
}

/* Compact, consistent application layout. */
.brand-bar {
  height: 72px;
  padding: 12px 20px;
}

.brand-mark {
  width: 40px;
  height: 40px;
}

.search-wrap {
  margin: 2px 18px 12px;
}

.search-wrap input {
  height: 44px;
}

.section-label {
  padding: 0 20px 8px;
}

.conversation-list {
  padding: 0 8px 12px;
}

.conversation-item {
  grid-template-columns: 44px minmax(0, 1fr) auto;
  min-height: 68px;
  gap: 11px;
  padding: 10px 12px;
}

.conversation-item .avatar {
  width: 44px;
  height: 44px;
}

.conversation-item.active {
  background: #fff4f4;
}

.conversation-item.active::before {
  top: 10px;
  bottom: 10px;
  width: 2px;
}

.conversation-side {
  gap: 7px;
}

.utility-header,
.jin10-header {
  min-height: 68px;
  padding: 10px 20px;
}

.contacts-content {
  padding: 12px 18px 24px;
}

.contact-search {
  position: relative;
  display: block;
  margin-bottom: 8px;
}

.contact-search svg {
  position: absolute;
  top: 50%;
  left: 12px;
  width: 18px;
  height: 18px;
  color: #8a9198;
  transform: translateY(-50%);
}

.contact-search input {
  width: 100%;
  height: 42px;
  padding: 0 14px 0 40px;
  border: 0;
  border-radius: 8px;
  color: var(--ink);
  background: #eceff1;
}

.contact-section {
  padding: 0 4px 8px;
}

.contact-section.requests-empty .member-heading {
  padding-bottom: 4px;
}

.contact-section.requests-empty .small-empty {
  padding: 8px 4px 14px;
  text-align: left;
}

.contact-friends {
  margin-top: 4px;
}

.profile-page-content {
  padding: 16px 18px 24px;
  place-items: start center;
}

.profile-page-content .profile-content {
  width: min(520px, 100%);
  border: 0;
  border-radius: 0;
  background: transparent;
}

.profile-content {
  padding: 12px 0 24px;
}

.profile-avatar {
  width: 56px;
  height: 56px;
  font-size: 18px;
}

.profile-content > strong {
  margin-top: 10px;
  font-size: 16px;
}

.profile-copy-button {
  margin-top: 14px;
}

.sound-settings,
.background-message-settings,
.profile-settings-list {
  width: 100%;
  margin-top: 10px;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: white;
}

.sound-settings {
  padding: 14px 6px 16px;
}

.background-message-settings {
  padding: 14px 6px 16px;
}

.profile-settings-list {
  border-top: 1px solid var(--line);
}

.profile-setting-button {
  min-height: 48px;
  padding: 0 6px;
}

.jin10-tabs {
  margin: 10px 18px 0;
}

.calendar-toolbar {
  min-height: 48px;
  padding: 7px 18px;
}

.calendar-row {
  grid-template-columns: 52px 40px minmax(0, 1fr);
  gap: 9px;
  padding: 14px 0;
}

.calendar-star {
  width: 36px;
  height: 23px;
}

.calendar-row:has(.star-5) {
  background: linear-gradient(90deg, rgba(223, 91, 99, 0.06), transparent 72%);
}

.chat-header {
  min-height: 68px;
  padding: 10px 18px;
}

.chat-header .avatar {
  width: 40px;
  height: 40px;
}

.announcement-banner {
  min-height: 38px;
  padding-top: 6px;
  padding-bottom: 6px;
}

.message-stream {
  padding-top: 20px;
}

.message-column {
  max-width: min(76%, 640px);
}

.message-bubble.multiline-bubble {
  min-width: min(260px, 68vw);
}

.composer {
  position: relative;
  grid-template-columns: 40px 40px minmax(0, 1fr) 44px;
  gap: 8px;
  padding-top: 12px;
  padding-bottom: 14px;
}

.composer-media-menu {
  position: absolute;
  z-index: 3;
  bottom: calc(100% - 8px);
  left: clamp(18px, 4vw, 64px);
  display: grid;
  min-width: 156px;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  box-shadow: 0 10px 28px rgba(20, 28, 36, 0.16);
}

.composer-media-menu[hidden] {
  display: none;
}

.composer-media-menu button {
  display: flex;
  min-height: 52px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 4px;
  border: 0;
  border-radius: 6px;
  color: #596168;
  background: #f2f4f5;
  font-size: 11px;
  cursor: pointer;
}

.composer-media-menu svg {
  width: 19px;
  height: 19px;
}

#composerMoreButton.active {
  color: var(--coral-strong);
  background: var(--coral-soft);
}

.voice-hold-button {
  grid-column: 3 / 5;
}

.drawer-header {
  min-height: 72px;
  padding: 12px 20px;
}

.drawer-content {
  padding-top: 14px;
}

.setting-section {
  padding-bottom: 16px;
}

.setting-section + .setting-section {
  padding-top: 16px;
}

.member-heading {
  padding: 16px 0 8px;
}

.setting-copy {
  min-width: 0;
}

#groupAnnouncementPreview {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow-wrap: anywhere;
}

.member-row {
  min-height: 50px;
}

.member-more-button {
  margin-left: 4px;
}

.drawer-danger-actions {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}

@media (max-width: 760px) {
  body {
    background: white;
  }

  .app-shell {
    display: block;
    width: 100vw;
    height: var(--app-height, 100dvh);
    min-height: 0;
    margin: 0;
    box-shadow: none;
  }

  .conversation-pane,
  .chat-pane {
    position: absolute;
    inset: 0;
  }

  .conversation-pane {
    z-index: 2;
    border-right: 0;
    transition: transform 180ms ease;
  }

  .account-bar {
    display: none;
  }

  .mobile-nav {
    display: grid;
    min-height: calc(62px + env(safe-area-inset-bottom));
    grid-template-columns: repeat(6, 1fr);
    padding: 6px 12px env(safe-area-inset-bottom);
    border-top: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.98);
  }

  .mobile-nav-item {
    position: relative;
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 5px 0;
    border: 0;
    color: #8c8587;
    background: transparent;
    font-size: 9px;
    cursor: pointer;
  }

  .mobile-nav-item svg {
    width: 20px;
    height: 20px;
  }

  .mobile-nav-item span:not(.mobile-request-indicator) {
    display: block;
  }

  .mobile-nav-item {
    flex-direction: column;
  }

  .mobile-nav-item.active {
    color: var(--coral);
  }

  .mobile-request-indicator {
    position: absolute;
    top: 4px;
    left: calc(50% + 7px);
    width: 8px;
    height: 8px;
    border: 2px solid white;
    border-radius: 50%;
    background: var(--coral);
  }

  .chat-pane {
    z-index: 1;
  }

  .jin10-pane,
  .realtime-pane,
  .decision-pane,
  .utility-pane {
    top: 0;
    right: 0;
    bottom: calc(62px + env(safe-area-inset-bottom));
    left: 0;
  }

  .app-shell.market-open .conversation-pane {
    transform: none;
  }

  .app-shell.realtime-open .conversation-pane { transform:none; }

  .app-shell.decision-open .conversation-pane {
    transform: none;
  }

  .app-shell.contacts-open .conversation-pane,
  .app-shell.profile-open .conversation-pane {
    transform: none;
  }

  .app-shell.chat-open .conversation-pane {
    transform: translateX(-100%);
  }

  .app-shell.chat-open .chat-pane {
    z-index: 3;
  }

  .mobile-back {
    display: grid;
  }

  .brand-bar {
    height: 68px;
    padding: 10px 18px;
  }

  .profile-modal {
    width: calc(100vw - 28px);
  }

  .brand-copy {
    min-width: 54px;
  }

  .brand-actions {
    gap: 1px;
  }

  .brand-actions .icon-button {
    width: 36px;
    height: 36px;
  }

  .message-column {
    max-width: 78%;
  }

  .composer {
    grid-template-columns: 38px 38px minmax(0, 1fr) 42px;
    gap: 6px;
    padding: 10px 12px calc(12px + env(safe-area-inset-bottom));
  }

  .composer-tool-button {
    width: 38px;
    height: 44px;
  }

  .send-button {
    width: 42px;
  }

  .message-stream {
    padding: 16px 14px 12px;
  }

  .composer-media-menu {
    bottom: calc(100% - 4px);
    left: 12px;
  }

  .voice-hold-button {
    grid-column: 3 / 5;
  }

  .chat-header {
    min-height: 64px;
    padding: 8px 12px;
  }

  .chat-heading {
    margin-left: 8px;
  }

  .utility-header,
  .jin10-header {
    min-height: 64px;
    padding: 8px 18px;
  }

  .message-image {
    max-width: min(300px, 72vw);
  }

  .composer textarea {
    font-size: 16px;
  }

  .drawer-scrim {
    z-index: 6;
  }

  .settings-drawer {
    z-index: 7;
    width: 100%;
  }
}

@media (max-width: 420px) {
  .auth-screen {
    padding: 0;
    background: white;
  }

  .auth-panel {
    width: 100%;
    padding: 24px;
    border: 0;
    box-shadow: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

/* v1.8.1 density and hierarchy pass */
.brand-bar {
  height: 62px;
  padding: 8px 18px;
}

.brand-mark {
  width: 38px;
  height: 38px;
  font-size: 16px;
}

.brand-bar h1 {
  font-size: 17px;
}

.search-wrap {
  margin: 4px 18px 10px;
}

.section-label {
  padding: 0 20px 6px;
}

.conversation-item {
  grid-template-columns: 42px minmax(0, 1fr) auto;
  min-height: 62px;
  gap: 10px;
  padding: 8px 12px;
}

.conversation-item .avatar {
  width: 42px;
  height: 42px;
}

.conversation-item.active {
  background: #f3f5f6;
}

.conversation-item.active::before {
  top: 8px;
  bottom: 8px;
  width: 2px;
}

.conversation-copy strong {
  margin-bottom: 2px;
  font-size: 13px;
}

.conversation-side {
  gap: 5px;
}

.utility-header,
.jin10-header {
  min-height: 60px;
  padding: 8px 18px;
}

.chat-header {
  min-height: 62px;
  padding: 8px 14px;
}

.chat-header .avatar {
  width: 38px;
  height: 38px;
}

.announcement-banner {
  min-height: 36px;
  padding-top: 5px;
  padding-bottom: 5px;
}

.announcement-banner span {
  font-size: 11px;
}

.message-stream {
  padding-top: 16px;
}

.message-row {
  margin-bottom: 10px;
}

.message-row.continuation {
  margin-top: -4px;
}

.message-row.incoming.continuation {
  padding-left: 46px;
}

.message-bubble {
  max-width: 100%;
  padding: 9px 12px;
  font-size: 13px;
  line-height: 21px;
}

.message-column {
  max-width: min(75%, 620px);
}

.message-meta {
  min-height: 16px;
  margin-top: 2px;
}

.message-time-divider {
  margin: 8px 0 14px;
}

.composer {
  grid-template-columns: 42px 42px minmax(0, 1fr) 42px;
  gap: 6px;
  padding-top: 9px;
  padding-bottom: 10px;
}

.composer-tool-button,
.send-button {
  width: 42px;
  height: 42px;
}

.composer textarea {
  min-height: 42px;
  padding: 9px 13px;
}

.contact-section.requests-empty .small-empty {
  min-height: 0;
  padding: 4px 4px 10px;
  font-size: 11px;
}

.friend-letter-group + .friend-letter-group {
  margin-top: 4px;
}

.friend-letter-label {
  position: sticky;
  top: 0;
  z-index: 1;
  padding: 6px 0 4px;
  color: #8a9198;
  background: #f6f7f8;
  font-size: 10px;
  font-weight: 700;
}

.contact-row {
  min-height: 52px;
}

.member-search {
  position: relative;
  display: block;
  margin: 0 0 10px;
}

.member-search svg {
  position: absolute;
  top: 50%;
  left: 10px;
  width: 16px;
  height: 16px;
  color: #8a9198;
  transform: translateY(-50%);
}

.member-search input {
  width: 100%;
  height: 36px;
  padding: 0 12px 0 34px;
  border: 0;
  border-radius: 7px;
  color: var(--ink);
  background: #eef1f2;
  font-size: 12px;
}

#memberList {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px 8px;
}

#memberList .member-row {
  position: relative;
  min-width: 0;
  min-height: 72px;
  align-items: center;
  flex-direction: column;
  gap: 5px;
  text-align: center;
}

#memberList .member-copy {
  width: 100%;
  flex: 0 0 auto;
}

#memberList .member-copy strong,
#memberList .member-copy span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#memberList .member-copy strong {
  font-size: 11px;
}

#memberList .member-copy span {
  font-size: 9px;
}

#memberList .member-more-button {
  position: absolute;
  top: -3px;
  right: 1px;
  display: grid;
  width: 24px;
  height: 24px;
  padding: 0;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--accent-strong);
  background: white;
}

#memberList .member-more-button svg {
  width: 13px;
  height: 13px;
}

.member-expand-button {
  width: 100%;
  height: 36px;
  margin-top: 12px;
  border: 0;
  border-radius: 7px;
  color: var(--accent-strong);
  background: var(--accent-soft);
  font-size: 11px;
  font-weight: 700;
}

.calendar-day-group > header {
  position: sticky;
  z-index: 2;
  top: 0;
  display: flex;
  min-height: 34px;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0 5px;
  color: #616970;
  background: #f6f7f8;
  font-size: 10px;
}

.calendar-day-group > header span {
  color: #979da3;
  font-weight: 400;
}

.calendar-priority-group > header strong {
  color: var(--coral-strong);
}

.calendar-row {
  grid-template-columns: 44px 38px minmax(0, 1fr);
  gap: 8px;
  padding: 12px 0;
}

.calendar-row.is-published {
  opacity: 0.66;
  background: transparent;
}

.calendar-row.is-published .calendar-star {
  color: #6e757b;
  background: #e4e7e9;
}

.calendar-row.is-published .calendar-title-line strong {
  font-weight: 600;
}

.calendar-time {
  padding-top: 3px;
  font-variant-numeric: tabular-nums;
}

.calendar-values {
  grid-template-columns: repeat(3, minmax(58px, 1fr));
  gap: 6px;
}

.calendar-value {
  min-width: 0;
}

.jin10-new-items {
  min-height: 34px;
  margin: 8px 18px 0;
  border: 0;
  border-radius: 7px;
  color: var(--accent-strong);
  background: var(--accent-soft);
  font-size: 11px;
  font-weight: 700;
}

.jin10-news-item {
  padding: 14px 0;
}

.jin10-news-head h3 {
  font-size: 13px;
  font-weight: 650;
  line-height: 20px;
}

.jin10-news-summary {
  margin-top: 6px;
  font-size: 11px;
  line-height: 18px;
}

.jin10-news-meta {
  margin-top: 8px;
}

.profile-page-content {
  padding-top: 10px;
}

.profile-content {
  padding-top: 6px;
}

.profile-avatar {
  width: 52px;
  height: 52px;
}

.profile-content > strong {
  margin-top: 7px;
}

.profile-copy-button {
  height: 38px;
  margin-top: 10px;
}

.sound-settings,
.background-message-settings {
  margin-top: 8px;
  padding-top: 10px;
  padding-bottom: 11px;
}

.sound-settings-header {
  padding-bottom: 8px;
}

.sound-setting-row {
  min-height: 42px;
}

.background-message-actions {
  margin-top: 8px;
}

.profile-setting-button {
  min-height: 46px;
}

.profile-logout-button {
  height: 38px;
}

.release-download-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin: 16px 0 4px;
  color: white;
  background: var(--accent);
  text-decoration: none;
}

.release-download-button svg {
  width: 16px;
  height: 16px;
}

@media (max-width: 760px) {
  .chat-pane,
  .utility-pane,
  .jin10-pane,
  .realtime-pane,
  .decision-pane,
  .settings-drawer,
  dialog[open] {
    touch-action: pan-y;
    overscroll-behavior-x: contain;
  }

  .image-viewer-content,
  .message-image-link,
  .sound-volume-row input {
    touch-action: auto;
  }

  .image-viewer-content {
    touch-action: none;
  }

  .mobile-nav {
    min-height: calc(58px + env(safe-area-inset-bottom));
    padding-top: 4px;
  }

  .jin10-pane,
  .realtime-pane,
  .decision-pane,
  .utility-pane {
    bottom: calc(58px + env(safe-area-inset-bottom));
  }

  .decision-header { min-height: 66px; padding: 10px 14px; }
  .decision-mark { width: 38px; height: 38px; }
  .decision-tabs { margin: 10px 12px 0; }
  .decision-page { padding: 10px 12px 22px; }
  .decision-level-columns, .decision-trade-grid { grid-template-columns: 1fr; }
  .decision-analysis-text { min-height: 76px; padding: 12px 13px; font-size: 13px; }
  .decision-daily-status { grid-template-columns: 32px minmax(0, 1fr) auto; gap: 8px; min-height: 54px; padding: 8px 10px; }
  .decision-status-icon { width: 30px; height: 30px; }
  .decision-status-lock { font-size: 0; }
  .decision-status-lock svg { width: 14px; height: 14px; }
  .decision-matrix-head > * { padding: 0 9px; }
  .decision-matrix-row > span { padding: 0 10px; }
  .decision-matrix-row strong { font-size: 15px; }
  .decision-editor-grid { grid-template-columns: 1fr; }
  .decision-editor-wide, .decision-plan-fieldset { grid-column: auto; }
  .decision-level-inputs, .decision-plan-grid { grid-template-columns: 1fr; }
  .decision-plan-grid textarea { grid-column: auto; }
  .decision-history-modal { width: calc(100vw - 16px); }
  .decision-history-list { max-height: 68dvh; }
  .decision-history-levels { grid-template-columns: repeat(3, 1fr); }
  .join-request-row { align-items: flex-start; flex-wrap: wrap; }
  .join-request-row .request-actions { width: 100%; justify-content: flex-end; }

  .brand-bar {
    height: 60px;
    padding: 7px 16px;
  }

  .chat-header {
    min-height: 60px;
    padding: 7px 10px;
  }

  .message-column {
    max-width: 76%;
  }

  .composer {
    grid-template-columns: 40px 40px minmax(0, 1fr) 40px;
    padding: 8px 10px calc(10px + env(safe-area-inset-bottom));
  }

  .composer-tool-button,
  .send-button {
    width: 40px;
    height: 42px;
  }

  .add-friend-modal {
    position: fixed;
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    max-width: none;
    max-height: 70dvh;
    margin: 0;
    border-radius: 8px 8px 0 0;
  }

  .add-friend-modal .modal-header {
    min-height: 68px;
    padding: 12px 18px;
  }

  .add-friend-modal .input-action-row {
    grid-template-columns: 1fr;
  }

  .add-friend-modal .input-action-row button {
    width: 100%;
  }

  .add-friend-modal .search-result {
    min-height: 36px;
  }
}

.message-image-link.long-image {
  position: relative;
  width: min(260px, 68vw);
  max-height: 240px;
  overflow: hidden;
  background: #eef0f2;
}

.message-image-link.long-image .message-image {
  width: 100%;
  height: 240px;
  max-width: none;
  max-height: 240px;
  object-fit: cover;
  object-position: top;
}

.long-image-badge {
  position: absolute;
  right: 8px;
  bottom: 8px;
  display: inline-grid;
  min-width: 38px;
  height: 24px;
  padding: 0 8px;
  place-items: center;
  border-radius: 6px;
  color: white;
  background: rgba(32, 37, 43, 0.84);
  font-size: 11px;
  font-weight: 700;
  line-height: 24px;
}

.inline-retry-error {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  min-height: 42px;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  padding: 8px 10px;
  border: 1px solid #efd0b0;
  border-radius: 7px;
  color: #8b5a22;
  background: #fff9ef;
  font-size: 11px;
}

.inline-retry-error svg {
  width: 16px;
  height: 16px;
}

.inline-retry-error button {
  height: 28px;
  padding: 0 9px;
  border: 1px solid #dfb57c;
  border-radius: 6px;
  color: #7c4b15;
  background: white;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}

#memberList button.member-row {
  width: 100%;
  padding: 0;
  border: 0;
  color: inherit;
  background: transparent;
  cursor: pointer;
}

#memberList .member-manageable {
  border-radius: 7px;
}

#memberList .member-manageable:hover,
#memberList .member-manageable:focus-visible {
  background: var(--accent-soft);
}

.preferences-content,
.global-search-results {
  min-height: 0;
  overflow-y: auto;
}

.preferences-content {
  max-height: min(650px, calc(100dvh - 120px));
  padding: 0 22px 22px;
}

.notification-preferences-modal {
  width: min(520px, calc(100vw - 28px));
}

.notification-preferences-modal .sound-settings,
.notification-preferences-modal .background-message-settings,
.quiet-hours-settings {
  width: 100%;
  margin: 0;
  padding: 18px 0;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}

.quiet-hours-settings .setting-row {
  padding: 0;
}

.quiet-hours-time-row {
  display: grid;
  grid-template-columns: 1fr 18px 1fr;
  align-items: end;
  gap: 10px;
  margin-top: 14px;
}

.quiet-hours-time-row > svg {
  width: 16px;
  height: 16px;
  margin-bottom: 12px;
  color: var(--muted);
}

.quiet-hours-time-row label {
  display: grid;
  gap: 7px;
  color: var(--muted);
  font-size: 10px;
}

.quiet-hours-time-row input {
  width: 100%;
  height: 40px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  color: var(--ink);
  background: var(--surface);
}

.quiet-hours-time-row.disabled {
  opacity: 0.5;
}

.quiet-hours-error {
  min-height: 16px;
  margin: 8px 0 0;
}

.quiet-hours-save {
  width: 100%;
  margin-top: 4px;
}

.global-search-modal {
  width: min(620px, calc(100vw - 28px));
}

.global-search-results {
  max-height: min(560px, calc(100dvh - 210px));
  padding: 12px 22px 22px;
}

.global-result-section + .global-result-section {
  margin-top: 16px;
}

.global-result-section > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 30px;
  color: var(--muted);
  font-size: 11px;
}

.global-result-row,
.global-message-result {
  width: 100%;
  border: 0;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.global-result-row {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 18px;
  min-height: 58px;
  align-items: center;
  gap: 10px;
}

.global-result-row > span:nth-child(2),
.global-result-row strong,
.global-result-row small {
  display: block;
  min-width: 0;
}

.global-result-row small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
}

.global-result-row > svg {
  width: 16px;
  height: 16px;
  color: var(--muted);
}

.global-message-result {
  display: block;
  min-height: 72px;
  padding: 10px 0;
}

.global-message-result > span {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.global-message-result time,
.global-message-result > small {
  color: var(--muted);
  font-size: 10px;
}

.global-message-result p {
  display: -webkit-box;
  margin: 5px 0 3px;
  overflow: hidden;
  font-size: 12px;
  line-height: 18px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.global-result-row:hover,
.global-message-result:hover {
  background: var(--accent-soft);
}

.appearance-options {
  padding: 8px 20px 20px;
}

.appearance-options button {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) 18px;
  width: 100%;
  min-height: 62px;
  align-items: center;
  gap: 10px;
  padding: 8px 4px;
  border: 0;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.appearance-options button > svg:first-child {
  width: 20px;
  height: 20px;
  color: var(--muted);
}

.appearance-options button > svg:last-child {
  display: none;
  width: 17px;
  height: 17px;
  color: var(--accent);
}

.appearance-options button.active > svg:last-child {
  display: block;
}

.appearance-options strong,
.appearance-options small {
  display: block;
}

.appearance-options small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 10px;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --ink: #f1f3f4;
  --muted: #a5abb1;
  --line: #34393e;
  --surface: #1e2226;
  --canvas: #15181b;
  --accent: #58aaa3;
  --accent-strong: #70c1ba;
  --accent-soft: #203b39;
  --coral: #df6d74;
  --coral-strong: #ef8389;
  --coral-soft: #41272a;
  --danger: #ef777e;
  --shadow: 0 18px 50px rgba(0, 0, 0, 0.42);
}

html[data-theme="dark"] body,
html[data-theme="dark"] .launch-screen,
html[data-theme="dark"] .auth-screen {
  background: #121518;
}

html[data-theme="dark"] .auth-panel,
html[data-theme="dark"] .app-shell,
html[data-theme="dark"] .conversation-pane,
html[data-theme="dark"] .chat-pane,
html[data-theme="dark"] .utility-pane,
html[data-theme="dark"] .jin10-pane,
html[data-theme="dark"] .realtime-pane,
html[data-theme="dark"] .decision-pane,
html[data-theme="dark"] .settings-drawer,
html[data-theme="dark"] .modal,
html[data-theme="dark"] .profile-settings-list,
html[data-theme="dark"] .profile-setting-button,
html[data-theme="dark"] .mobile-nav,
html[data-theme="dark"] .composer {
  color: var(--ink);
  background: var(--surface);
}

html[data-theme="dark"] .brand-bar,
html[data-theme="dark"] .chat-header,
html[data-theme="dark"] .utility-header,
html[data-theme="dark"] .jin10-header,
html[data-theme="dark"] .realtime-header,
html[data-theme="dark"] .decision-header {
  color: var(--ink);
  border-color: var(--line);
  background: var(--surface);
}

html[data-theme="dark"] .secondary-button,
html[data-theme="dark"] .profile-copy-button,
html[data-theme="dark"] .decision-refresh,
html[data-theme="dark"] .decision-history-button,
html[data-theme="dark"] .jin10-refresh,
html[data-theme="dark"] .realtime-refresh,
html[data-theme="dark"] .realtime-history-button {
  color: var(--ink);
  border-color: var(--line);
  background: #252a2f;
}

html[data-theme="dark"] .realtime-live-strip { color: #b4e3d8; border-color: #2f504b; background: #203b38; }
html[data-theme="dark"] .realtime-card,
html[data-theme="dark"] .realtime-history-card,
html[data-theme="dark"] .realtime-level-grid > div,
html[data-theme="dark"] .realtime-note { color: var(--ink); border-color: var(--line); background: #23282d; }
html[data-theme="dark"] .realtime-level-grid .entry { background: #1e3834; }
html[data-theme="dark"] .realtime-level-grid .stop { background: #432a30; }
html[data-theme="dark"] .realtime-level-grid .target { background: #443822; }
html[data-theme="dark"] .realtime-tabs { background:#252a2f; }
html[data-theme="dark"] .realtime-tabs button.active,
html[data-theme="dark"] .realtime-stat-section { color:var(--ink); border-color:var(--line); background:#1e2226; }
html[data-theme="dark"] .realtime-result-head,
html[data-theme="dark"] .realtime-result-route > div,
html[data-theme="dark"] .realtime-stat-grid > div,
html[data-theme="dark"] .realtime-result-editor { color:var(--ink); border-color:var(--line); background:#252a2f; }
html[data-theme="dark"] .realtime-stat-grid .profit,
html[data-theme="dark"] .realtime-current-result { background:#1e3834; }
html[data-theme="dark"] .realtime-stat-grid .loss { background:#432a30; }

html[data-theme="dark"] .message-stream,
html[data-theme="dark"] .utility-content,
html[data-theme="dark"] .jin10-content,
html[data-theme="dark"] .realtime-content,
html[data-theme="dark"] .decision-content,
html[data-theme="dark"] .drawer-content,
html[data-theme="dark"] .contacts-content,
html[data-theme="dark"] .profile-page-content {
  background: var(--canvas);
}

html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select,
html[data-theme="dark"] .search-wrap,
html[data-theme="dark"] .contact-search,
html[data-theme="dark"] .member-search,
html[data-theme="dark"] .auth-tabs,
html[data-theme="dark"] .week-switch,
html[data-theme="dark"] .jin10-tabs,
html[data-theme="dark"] .decision-tabs {
  color: var(--ink);
  border-color: var(--line);
  background: #252a2f;
}

html[data-theme="dark"] .auth-tab.active,
html[data-theme="dark"] .jin10-tab.active,
html[data-theme="dark"] .decision-tab.active,
html[data-theme="dark"] .week-switch button.active {
  border-color:var(--line);
}
html[data-theme="dark"] .market-chart-section,
html[data-theme="dark"] .strategy-location,
html[data-theme="dark"] .strategy-risk-disclaimer,
html[data-theme="dark"] .notification-category-settings,
html[data-theme="dark"] .risk-calculator-result,
html[data-theme="dark"] .realtime-advanced-grid > div {
  color:var(--ink); border-color:var(--line); background:#23282d;
}

@media (max-width: 600px) {
  .realtime-stat-filters,.calendar-toolbar { flex-wrap:wrap; }
  .realtime-stat-filters select { flex:1; min-width:0; }
  .realtime-advanced-grid,.risk-calculator-grid { grid-template-columns:1fr; }
  .risk-calculator-result { grid-template-columns:1fr; }
  .risk-calculator-result small { grid-column:1; }
  .market-chart-section { padding:10px 6px; }
}
html[data-theme="dark"] .message-bubble,
html[data-theme="dark"] .decision-daily-status,
html[data-theme="dark"] .decision-analysis-text,
html[data-theme="dark"] .decision-level-matrix,
html[data-theme="dark"] .decision-trade-grid article,
html[data-theme="dark"] .decision-exit {
  color: var(--ink);
  border-color: var(--line);
  background: #23282d;
}

html[data-theme="dark"] .outgoing .message-bubble:not(.image-bubble) {
  color: white;
  background: #347f79;
}

html[data-theme="dark"] .incoming .message-bubble,
html[data-theme="dark"] .message-bubble.image-bubble,
html[data-theme="dark"] .message-bubble.attachment-bubble {
  color: var(--ink);
  border-color: var(--line);
  background: #282d32;
}

html[data-theme="dark"] .strategy-alert-message { color: #d9eee8; border-color: #315d54; background: #19332d; }
html[data-theme="dark"] .strategy-alert-message p { color: #c4d9d3; }
html[data-theme="dark"] .strategy-alert-message > small { color: #aabbb6; background: rgba(7, 18, 16, 0.38); }
html[data-theme="dark"] .strategy-alert-message.event-profit { color: #f3e3b7; border-color: #665426; background: #332d1d; }
html[data-theme="dark"] .strategy-alert-message.event-target_1,
html[data-theme="dark"] .strategy-alert-message.event-target_2,
html[data-theme="dark"] .strategy-alert-message.event-target_3 { border-color: #315e42; background: #1b3223; }
html[data-theme="dark"] .strategy-alert-message.event-stop,
html[data-theme="dark"] .strategy-alert-message.event-invalid_reentry { color: #f1d3d6; border-color: #6a3940; background: #372125; }

@media (max-width: 600px) {
  .strategy-alert-message { width: calc(100% - 8px); }
  .strategy-alert-message h3 { font-size: 13px; }
  .strategy-alert-message p { font-size: 11px; }
}

html[data-theme="dark"] .friend-letter-label,
html[data-theme="dark"] .decision-matrix-head,
html[data-theme="dark"] .calendar-day-header {
  background: #252a2f;
}

html[data-theme="dark"] .decision-daily-status.is-current {
  border-color: #315e57;
  background: #1c332f;
}

html[data-theme="dark"] .decision-daily-status.is-stale,
html[data-theme="dark"] .inline-retry-error {
  border-color: #6f5634;
  color: #edbd7d;
  background: #33291d;
}

html[data-theme="dark"] .decision-watershed-row {
  border-color: var(--line);
  background: #332f26;
}

html[data-theme="dark"] .decision-watershed-row span {
  color: #d9bd84;
}

html[data-theme="dark"] .decision-watershed-row strong {
  color: var(--ink);
}

html[data-theme="dark"] .modal::backdrop {
  background: rgba(4, 6, 8, 0.7);
}

/* h54: keep the admin header visible while health, moderation, and reports scroll. */
dialog.modal.admin-operations-modal[open] {
  display: flex;
  width: min(560px, calc(100vw - 20px));
  height: min(820px, calc(var(--app-height, 100dvh) - 18px));
  max-height: calc(var(--app-height, 100dvh) - 18px);
  flex-direction: column;
  overflow: hidden;
}

.admin-operations-modal > .modal-header {
  flex: 0 0 auto;
}

.admin-operations-scroll {
  min-height: 0;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.admin-operations-scroll .admin-health-grid {
  padding-top: 0;
}

.admin-operations-scroll .admin-reports-section {
  padding-bottom: max(18px, env(safe-area-inset-bottom));
}

@media (max-width: 760px) {
  dialog.modal.admin-operations-modal[open] {
    width: calc(100vw - 12px);
    height: calc(var(--app-height, 100dvh) - 12px);
    max-height: calc(var(--app-height, 100dvh) - 12px);
  }
}

@media (max-width: 760px) {
  .add-friend-modal,
  body.modal-keyboard-open .add-friend-modal {
    height: auto;
    max-height: min(440px, calc(var(--app-height, 100dvh) - 8px));
  }

  .add-friend-modal form {
    height: auto;
    max-height: min(440px, calc(var(--app-height, 100dvh) - 8px));
  }

  .preferences-content {
    max-height: calc(var(--app-height, 100dvh) - 78px);
    padding-right: 18px;
    padding-left: 18px;
  }

  .notification-preferences-modal,
  .global-search-modal,
  .appearance-modal {
    width: calc(100vw - 16px);
    max-height: calc(var(--app-height, 100dvh) - 16px);
  }

  .global-search-results {
    max-height: calc(var(--app-height, 100dvh) - 188px);
    padding-right: 18px;
    padding-left: 18px;
  }

  .realtime-tabs { margin-right:14px; margin-left:14px; }
  .realtime-page, .realtime-stats-page { padding-right:14px; padding-left:14px; }
  .realtime-editor-grid, .realtime-result-editor-grid { grid-template-columns:1fr; }
  .realtime-result-editor-grid .realtime-editor-wide { grid-column:auto; }
  .realtime-result-editor { padding:12px; }
}

/* v1.15: gold market and communication system */
.launch-screen,
.auth-screen { background:#edf1ef; }

.launch-brand .brand-mark,
.auth-brand .brand-mark,
.brand-mark { color:#fff; background:#0d796e; }

.auth-panel {
  width:min(390px,100%);
  padding:30px;
  border-color:#dfe7e3;
  border-radius:16px;
  box-shadow:0 22px 55px rgba(29,49,43,.14);
}

.auth-brand { justify-content:center; flex-direction:column; margin-bottom:24px; text-align:center; }
.auth-brand .brand-mark { width:68px; height:68px; border-radius:19px; font-size:27px; }
.auth-brand h1 { font-size:26px; }
.auth-brand p { margin-top:4px; }
.auth-tabs { background:#e8eeeb; }
.auth-tab.active { color:#0d796e; }
.auth-form .field-group input { min-height:48px; background:#f9fbfa; }
.app-download-button { border-color:#dfe7e3; border-radius:11px; background:#fff; }

.app-shell { border-color:#dfe7e3; border-radius:12px; box-shadow:0 24px 70px rgba(29,49,43,.17); }
.conversation-pane { background:#f5f7f6; }
.brand-bar { background:#f5f7f6; }
.brand-mark { border-radius:11px; }
.brand-copy h1 { color:#182220; }
.brand-contact-button { position:relative; }
.brand-contact-button .mobile-request-indicator { top:2px; right:2px; left:auto; }
.brand-contact-button.active { color:#0d796e; background:#e7f6f1; }
.search-wrap input { border:1px solid #dfe7e3; border-radius:11px; background:#fff; }
.conversation-list { padding:0 10px 14px; }
.conversation-item { margin-bottom:8px; border:1px solid transparent; border-radius:12px; background:#fff; }
.conversation-item:hover { border-color:#cbdad5; background:#fff; }
.conversation-item.active { border-color:#b8dbd2; background:#eaf7f3; }
.conversation-item.active::before { background:#0d796e; }
.conversation-item .avatar { border-radius:12px; }
.conversation-type { color:#725b2f !important; background:#fff4d6; }
.unread-badge { background:#bd4f55; }

.mobile-nav { grid-template-columns:repeat(5,1fr); padding-right:8px; padding-left:8px; }
.mobile-nav-item { color:#87918e; }
.mobile-nav-item.active { color:#0d796e; }
.mobile-nav-item.active::after {
  content:"";
  position:absolute;
  top:3px;
  left:calc(50% + 8px);
  width:5px;
  height:5px;
  border-radius:50%;
  background:#c59439;
}

.chat-pane,
.jin10-pane,
.realtime-pane,
.decision-pane,
.utility-pane { background:#f5f7f6; }
.chat-header,
.utility-header,
.jin10-header,
.realtime-header,
.decision-header { border-color:#dfe7e3; background:rgba(255,255,255,.98); }
.chat-header .avatar { border-radius:12px; }
.announcement-banner { border-color:#ead9b3; background:#fff8e8; }
.message-stream { background:#f5f7f6; }
.message-bubble { border-radius:13px; box-shadow:none; }
.message-row.mine .message-bubble { color:#163c35; background:#e2f4ef; }
.composer { border-color:#dfe7e3; background:rgba(255,255,255,.98); }
.composer textarea { border-color:#dfe7e3; border-radius:11px; background:#f9fbfa; }
.send-button { border-radius:11px; background:#0d796e; }

.utility-header p,
.utility-header h2 { margin:0; }
.contacts-content { background:#f5f7f6; }
.contact-search input { border:1px solid #dfe7e3; border-radius:11px; background:#fff; }
.contact-row { margin-bottom:8px; border:1px solid transparent; border-radius:12px; background:#fff; }
.contact-button:hover { border-color:#cbdad5; background:#fff; }
.friend-letter-label { color:#0d796e; background:#edf1ef; }
.member-row,
.picker-row { border-radius:10px; }

.profile-page-content { background:#f5f7f6; }
.profile-page-content .profile-content { padding:18px; border-radius:14px; }
.profile-avatar { border:5px solid #dff1ec; border-radius:18px; }
.profile-content > strong { color:#182220; }
.profile-settings-list { overflow:hidden; border:1px solid #dfe7e3; border-radius:12px; background:#fff; }
.profile-setting-button { min-height:54px; padding:0 14px; }
.profile-setting-button > svg:first-child { padding:7px; border-radius:9px; color:#0d796e; background:#e7f6f1; box-sizing:content-box; }
.profile-logout-button { border-radius:11px; color:#bd4f55; background:#fff0f0; }
.home-level-strip { display:grid; width:calc(100% - 36px); grid-template-columns:repeat(3,1fr); gap:6px; margin:0 18px 11px; padding:10px; border:1px solid #dfe7e3; border-radius:11px; color:#182220; background:#fff; text-align:left; cursor:pointer; }
.home-level-strip.is-stale { opacity:.68; }
.home-level-title { display:flex; grid-column:1/-1; align-items:center; justify-content:space-between; color:#0d796e; }
.home-level-title small { font-size:9px; font-weight:700; }
.home-level-title svg { width:14px; height:14px; }
.home-level-strip > span:not(.home-level-title) { min-width:0; padding:7px; border-radius:8px; background:#f4f7f6; }
.home-level-strip > span small,
.home-level-strip > span strong { display:block; }
.home-level-strip > span small { color:#71807a; font-size:8px; }
.home-level-strip > span strong { overflow:hidden; margin-top:3px; font-size:10px; font-variant-numeric:tabular-nums; text-overflow:ellipsis; }
.home-level-strip > span:nth-child(2) strong { color:#bd4f55; }
.home-level-strip > span:nth-child(4) strong { color:#0d796e; }

.jin10-mark { color:#fff; background:#0d796e; }
.jin10-tabs { grid-template-columns:repeat(3,1fr); background:#e8eeeb; }
.jin10-tab.active { color:#0d796e; }
.jin10-content { background:#f5f7f6; }
.calendar-toolbar { background:#fff; }
.calendar-day-group { border-radius:12px; background:#fff; }
.calendar-row { padding-right:14px; padding-left:14px; }
.calendar-priority-group { border:1px solid #f0d9db; }
.calendar-row:has(.star-5) { background:#fff5f5; }
.jin10-news-list { gap:10px; padding:12px 18px 26px; }
.jin10-news-item { border:1px solid transparent; border-radius:12px; background:#fff; }
.jin10-news-item:hover,
.jin10-news-item:focus-visible { border-color:#cbdad5; background:#fff; }

.gold-market-overview { width:min(860px,100%); margin:0 auto; padding:14px 18px 30px; }
.gold-market-hero { padding:20px; border-radius:14px; color:#fff; background:#182b27; }
.gold-market-symbol { display:flex; align-items:center; justify-content:space-between; gap:12px; color:#c8d6d1; font-size:11px; }
.gold-market-symbol small { display:flex; align-items:center; gap:5px; color:#b8d9cf; font-size:9px; }
.gold-market-symbol small i { width:6px; height:6px; border-radius:50%; background:#56c59d; box-shadow:0 0 0 3px rgba(86,197,157,.14); }
.gold-market-hero.is-stale .gold-market-symbol small { color:#e1bd72; }
.gold-market-hero.is-stale .gold-market-symbol small i { background:#d8ae59; box-shadow:0 0 0 3px rgba(216,174,89,.14); }
.gold-market-hero > strong { display:block; margin-top:24px; font-size:27px; }
.gold-market-hero > p { margin:8px 0 0; color:#bdcbc6; font-size:12px; line-height:1.7; }
.gold-quote-main { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-top:22px; }
.gold-quote-main > div { min-width:0; }
.gold-quote-main strong,
.gold-quote-main span { display:block; }
.gold-quote-main strong { color:#fff; font-size:40px; line-height:1.08; font-variant-numeric:tabular-nums; letter-spacing:0; }
.gold-quote-main span { margin-top:7px; color:#d8ae59; font-size:13px; font-weight:700; font-variant-numeric:tabular-nums; }
.gold-quote-down .gold-quote-main span { color:#66cfa9; }
.gold-quote-flat .gold-quote-main span { color:#c8d6d1; }
.gold-quote-main > small { flex:0 0 auto; padding-bottom:3px; color:#91a39d; font-size:9px; }
.gold-quote-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:18px; padding:12px 0; border-top:1px solid #34514a; border-bottom:1px solid #34514a; }
.gold-quote-metrics div { min-width:0; }
.gold-quote-metrics span,
.gold-quote-metrics strong { display:block; }
.gold-quote-metrics span { color:#91a39d; font-size:9px; }
.gold-quote-metrics strong { margin-top:4px; color:#e9f0ed; font-size:13px; font-variant-numeric:tabular-nums; }
.gold-market-actions { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:18px; }
.gold-market-actions button { display:flex; min-height:48px; align-items:center; justify-content:center; gap:7px; border:1px solid #34514a; border-radius:10px; color:#fff; background:#213a34; font-size:11px; font-weight:700; cursor:pointer; }
.gold-market-actions button:hover { border-color:#4e776d; background:#294840; }
.gold-market-actions svg { width:16px; }
.gold-market-levels { margin-top:11px; padding:15px; border:1px solid #dfe7e3; border-radius:12px; background:#fff; }
.gold-market-levels.is-stale { opacity:.72; }
.gold-market-levels header { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; }
.gold-market-levels header span { color:#0d796e; font-size:9px; font-weight:700; }
.gold-market-levels header h3 { margin:3px 0 0; font-size:15px; }
.gold-market-levels header small { color:#71807a; font-size:9px; }
.gold-market-level-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-top:12px; }
.gold-market-level-grid > div { display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.gold-market-level-grid span { min-width:0; padding:9px; border-radius:9px; background:#f6f8f7; }
.gold-market-level-grid small,
.gold-market-level-grid strong { display:block; }
.gold-market-level-grid small { color:#71807a; font-size:8px; }
.gold-market-level-grid strong { margin-top:3px; color:#182220; font-size:12px; font-variant-numeric:tabular-nums; }
.gold-market-level-grid span:first-child strong { color:#bd4f55; }
.gold-market-level-grid span:last-child strong { color:#0d796e; }
.gold-market-levels footer { display:flex; align-items:center; justify-content:space-between; margin-top:8px; padding:9px 11px; border-radius:9px; color:#72531c; background:#fff8ea; font-size:10px; }
.gold-market-levels footer strong { font-size:13px; font-variant-numeric:tabular-nums; }
.gold-market-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-top:11px; }
.gold-market-summary > div { padding:13px; border:1px solid #dfe7e3; border-radius:12px; background:#fff; }
.gold-market-summary span,
.gold-market-summary strong,
.gold-market-summary small { display:block; }
.gold-market-summary span { color:#71807a; font-size:9px; }
.gold-market-summary strong { margin-top:7px; color:#0d796e; font-size:22px; }
.gold-market-summary small { margin-top:3px; color:#71807a; font-size:9px; }
.gold-market-latest { margin-top:14px; padding:15px; border:1px solid #dfe7e3; border-radius:13px; background:#fff; }
.gold-market-latest header { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-bottom:8px; }
.gold-market-latest header span { color:#0d796e; font-size:9px; font-weight:700; }
.gold-market-latest h3 { margin:3px 0 0; font-size:15px; }
.gold-market-latest header button { border:0; color:#0d796e; background:transparent; font-size:10px; font-weight:700; cursor:pointer; }
.gold-market-news { display:grid; width:100%; min-height:48px; grid-template-columns:52px minmax(0,1fr) 18px; align-items:center; gap:8px; padding:0; border:0; border-top:1px solid #edf1ef; color:#182220; background:transparent; text-align:left; cursor:pointer; }
.gold-market-news time { color:#71807a; font-size:9px; }
.gold-market-news strong { overflow:hidden; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.gold-market-news svg { width:15px; color:#87918e; }

.realtime-mark,
.decision-mark { border-radius:11px; background:#0d796e; }
.realtime-header-edit,
.decision-header-edit { color:#0d796e; background:#e7f6f1; }
.realtime-live-strip { border-color:#b9ded5; background:#e9f6f2; }
.realtime-tabs,
.decision-tabs { background:#e8eeeb; }
.realtime-tabs button.active,
.decision-tab.active { color:#0d796e; }
.realtime-card,
.realtime-stat-section,
.decision-level-matrix,
.decision-trade-grid article,
.decision-exit { border-radius:12px; }
.realtime-direction,
.realtime-level-grid .entry,
.realtime-current-result { color:#0d796e; background:#e7f6f1; }
.realtime-level-grid > div { border-radius:10px; }
.realtime-level-grid .target { background:#fff8ea; }
.realtime-level-grid .stop { background:#fff0f0; }
.realtime-result-editor { border-radius:12px; }
.decision-analysis-text { border-left-color:#0d796e; border-radius:0 11px 11px 0; }
.decision-watershed-row { background:#fff8ea; }
.decision-level-source { display:flex; align-items:center; gap:10px; margin:10px 0 8px; padding:9px 12px; border:1px solid #dfe7e3; border-radius:10px; background:#f9fbfa; font-size:10px; }
.decision-level-source span { margin-right:auto; color:#71807a; }
.decision-level-source b { color:#34413d; font-variant-numeric:tabular-nums; }
.auto-level-fieldset input[readonly],
.decision-watershed-field input[readonly] { color:#56635f; background:#eef2f0; cursor:not-allowed; }
.field-help { display:block; margin-top:6px; color:#71807a; font-size:10px; line-height:1.5; }

.modal,
.settings-drawer { border-radius:14px; }
.modal-header { border-color:#dfe7e3; }
.field-group input,
.field-group select,
.field-group textarea { border-color:#dfe7e3; border-radius:10px; background:#f9fbfa; }
.primary-button { border-radius:10px; background:#0d796e; }
.secondary-button { border-radius:10px; }
.toast { bottom:calc(76px + env(safe-area-inset-bottom)); border-radius:11px; }

html[data-theme="dark"] .conversation-pane,
html[data-theme="dark"] .contacts-content,
html[data-theme="dark"] .profile-page-content,
html[data-theme="dark"] .jin10-content,
html[data-theme="dark"] .message-stream { background:#161b1a; }
html[data-theme="dark"] .conversation-item,
html[data-theme="dark"] .contact-row,
html[data-theme="dark"] .home-level-strip,
html[data-theme="dark"] .gold-market-summary > div,
html[data-theme="dark"] .gold-market-levels,
html[data-theme="dark"] .gold-market-latest { border-color:#39433f; background:#202725; }
html[data-theme="dark"] .gold-market-level-grid span,
html[data-theme="dark"] .home-level-strip > span:not(.home-level-title),
html[data-theme="dark"] .decision-level-source { border-color:#39433f; background:#18201e; }
html[data-theme="dark"] .gold-market-level-grid strong,
html[data-theme="dark"] .decision-level-source b { color:#e5ece9; }

@media (max-width:760px) {
  .mobile-nav { min-height:calc(58px + env(safe-area-inset-bottom)); grid-template-columns:repeat(5,1fr); padding:4px 8px env(safe-area-inset-bottom); }
  .mobile-nav-item { min-height:54px; }
  .jin10-pane,
  .realtime-pane,
  .decision-pane,
  .utility-pane { bottom:calc(58px + env(safe-area-inset-bottom)); }
  .brand-bar { min-height:68px; background:#f5f7f6; }
  .brand-copy h1 { font-size:18px; }
  .conversation-list { padding-bottom:72px; }
  .gold-market-overview { padding:12px 12px 24px; }
  .gold-market-hero { padding:16px; }
  .gold-market-hero > strong { font-size:22px; }
  .gold-quote-main strong { font-size:34px; }
  .gold-quote-main { align-items:flex-start; flex-direction:column; gap:6px; }
  .gold-quote-main > small { padding:0; }
  .gold-market-actions { grid-template-columns:1fr; }
  .gold-market-actions button { justify-content:flex-start; padding:0 14px; }
  .gold-market-summary { gap:6px; }
  .gold-market-level-grid { grid-template-columns:1fr; }
  .gold-market-level-grid > div { grid-template-columns:1fr 1fr; }
  .gold-market-summary > div { padding:10px; }
  .gold-market-summary strong { font-size:18px; }
  .jin10-tabs { margin-right:12px; margin-left:12px; }
  .jin10-news-list { padding-right:12px; padding-left:12px; }
  .realtime-header,
  .decision-header { min-height:68px; padding:10px 14px; }
  .realtime-mark,
  .decision-mark { width:38px; height:38px; }
  .realtime-heading h2,
  .decision-heading h2 { font-size:18px; }
  .profile-page-content .profile-content { padding:12px; }
  .toast { right:14px; bottom:calc(70px + env(safe-area-inset-bottom)); left:14px; width:auto; max-width:none; text-align:center; transform:translate(0, 8px); }
  .toast.show { transform:translate(0, 0); }
}

/* Keep chat records inside the viewport on narrow screens. */
.chat-pane,
.message-stream {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: hidden;
}

/* h43: focused market chart, economic impact, news intelligence, and trading notes. */
.gold-market-overview .market-chart-section { margin-top:0; border-radius:12px; }

/* h44: multi-period chart controls and stable live-price updates. */
.market-chart-heading { min-width:0; }
.market-chart-heading > div { display:flex; align-items:baseline; gap:9px; min-height:24px; }
.market-chart-heading h3 { flex:none; }
.market-live-price { min-width:84px; font-size:16px; font-variant-numeric:tabular-nums; letter-spacing:0; }
.market-live-price.tone-positive { color:#0d796e; }
.market-live-price.tone-negative { color:#bd4f55; }
.market-live-price.tone-neutral { color:#5d6965; }

@keyframes quote-tick-up {
  0% { background-color:rgba(13,121,110,.20); box-shadow:0 0 0 5px rgba(13,121,110,.08); }
  100% { background-color:transparent; box-shadow:0 0 0 0 rgba(13,121,110,0); }
}
@keyframes quote-tick-down {
  0% { background-color:rgba(189,79,85,.20); box-shadow:0 0 0 5px rgba(189,79,85,.08); }
  100% { background-color:transparent; box-shadow:0 0 0 0 rgba(189,79,85,0); }
}
[data-market-live-price],
#analysisGroupQuotePrice {
  border-radius:4px;
  transition:color .18s ease;
}
[data-market-live-price].tick-up,
#analysisGroupQuotePrice.tick-up { animation:quote-tick-up .52s ease-out; }
[data-market-live-price].tick-down,
#analysisGroupQuotePrice.tick-down { animation:quote-tick-down .52s ease-out; }
.market-chart-toolbar { display:grid; gap:8px; margin-bottom:8px; }
.market-period-switch,
.market-indicator-switch { display:grid; gap:4px; overflow-x:auto; scrollbar-width:none; }
.market-period-switch::-webkit-scrollbar,
.market-indicator-switch::-webkit-scrollbar { display:none; }
.market-period-switch { grid-template-columns:repeat(6,minmax(0,1fr)); }
.market-indicator-switch { grid-template-columns:repeat(4,minmax(74px,1fr)); }
.market-period-switch button,
.market-indicator-switch button {
  display:flex;
  height:34px;
  min-width:0;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:0 8px;
  border:1px solid #dfe5e2;
  border-radius:6px;
  color:#66736e;
  background:#f5f7f6;
  font-size:10px;
  font-weight:700;
  line-height:1;
  letter-spacing:0;
  white-space:nowrap;
  cursor:pointer;
  transition:color 180ms ease,background-color 180ms ease,border-color 180ms ease;
}
.market-indicator-switch button { height:36px; }
.market-indicator-switch button svg { width:14px; height:14px; flex:none; }
.market-period-switch button.active,
.market-indicator-switch button.active { border-color:#77aaa1; color:#0d796e; background:#e8f5f1; }
.market-period-switch button:focus-visible,
.market-indicator-switch button:focus-visible { outline:2px solid rgba(13,121,110,.25); outline-offset:1px; }
.market-chart-stage { position:relative; width:100%; height:340px; overflow:hidden; border-top:1px solid rgba(120,130,140,.10); border-bottom:1px solid rgba(120,130,140,.10); background:transparent; }
.market-chart-stage .market-chart { position:relative; z-index:1; width:100%; height:340px; min-height:340px; }
.market-timeframe-watermark {
  position:absolute;
  z-index:0;
  top:50%;
  left:50%;
  color:rgba(89,105,99,.09);
  font-size:44px;
  font-weight:800;
  letter-spacing:0;
  pointer-events:none;
  transform:translate(-50%,-50%);
  white-space:nowrap;
}
.market-chart-move { position:absolute; z-index:2; top:8px; right:8px; display:grid; width:28px; height:28px; place-items:center; border:1px solid rgba(120,130,140,.16); border-radius:6px; color:#84908c; background:rgba(255,255,255,.82); pointer-events:none; }
.market-chart-move svg { width:14px; height:14px; }
.market-chart-section > p { min-height:17px; }
.market-chart-section .jin10-loading { height:340px; }

html[data-theme="dark"] .market-period-switch button,
html[data-theme="dark"] .market-indicator-switch button { border-color:#39433f; color:#aeb9b5; background:#202622; }
html[data-theme="dark"] .market-period-switch button.active,
html[data-theme="dark"] .market-indicator-switch button.active { border-color:#477d73; color:#8ed0c3; background:#19312c; }
html[data-theme="dark"] .market-live-price.tone-neutral { color:#c1cac7; }
html[data-theme="dark"] .market-chart-move { border-color:#39433f; color:#a4afab; background:rgba(28,33,31,.82); }
html[data-theme="dark"] .market-timeframe-watermark { color:rgba(204,221,215,.07); }

@media (max-width:520px) {
  .market-chart-heading > div { gap:7px; }
  .market-live-price { min-width:78px; font-size:15px; }
  .market-period-switch { grid-template-columns:repeat(6,minmax(0,1fr)); }
  .market-indicator-switch { grid-template-columns:repeat(4,78px); }
  .market-period-switch button,
  .market-indicator-switch button { padding:0 6px; }
  .market-period-switch button { font-size:9px; }
  .market-timeframe-watermark { font-size:38px; }
}

/* h47: quote-first market layout modeled on a professional trading terminal. */
.gold-market-overview {
  width:calc(100% + 36px);
  max-width:none;
  margin:0 -18px;
  padding:0 0 24px;
  color:#242827;
  background:#f4f6f5;
}
.market-quote-board { padding:16px 18px 12px; border-bottom:1px solid #e5e9e7; background:#fff; }
.market-quote-board > header { display:grid; gap:6px; }
.market-symbol-title { display:flex; min-width:0; align-items:center; gap:8px; }
.market-symbol-title strong { font-size:20px; line-height:1.2; }
.market-symbol-title span { color:#747b78; font-size:16px; }
.market-symbol-title svg { width:17px; height:17px; color:#4f5754; }
.market-symbol-meta { display:flex; min-width:0; align-items:center; gap:8px; color:#747b78; font-size:10px; font-variant-numeric:tabular-nums; }
.market-symbol-meta em { padding:3px 6px; border-radius:4px; color:#6d7471; background:#f0f2f1; font-style:normal; }
.market-symbol-meta span { padding:3px 6px; color:#5277ad; background:#f1f5fb; }
.market-quote-summary { display:grid; grid-template-columns:minmax(128px,.8fr) minmax(0,1.5fr); align-items:center; gap:18px; margin-top:16px; }
.market-quote-primary { min-width:0; }
.market-quote-primary .market-live-price { display:block; min-width:0; color:#2d3130; font-size:34px; line-height:1.05; font-variant-numeric:tabular-nums; }
.market-quote-primary > span { display:block; margin-top:8px; color:#5d6562; font-size:13px; font-weight:700; font-variant-numeric:tabular-nums; }
.market-quote-primary > span b { font:inherit; }
.market-up .market-live-price,
.market-up .market-quote-primary > span { color:#ce5059; }
.market-down .market-live-price,
.market-down .market-quote-primary > span { color:#3ca679; }
.market-quote-matrix { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 14px; }
.market-quote-matrix > div { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:baseline; gap:7px; }
.market-quote-matrix span { color:#7b827f; font-size:10px; }
.market-quote-matrix strong { min-width:0; color:#303433; font-size:14px; font-variant-numeric:tabular-nums; text-align:right; }
.market-quote-matrix > div:nth-child(1) strong,
.market-quote-matrix > div:nth-child(4) strong { color:#ce5059; }
.market-quote-matrix > div:nth-child(3) strong { color:#3ca679; }
.market-quote-board > footer { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:14px; padding-top:9px; border-top:1px solid #edf0ee; color:#7b827f; font-size:9px; }
.market-quote-board > footer strong { color:#59615e; font-size:10px; }

.gold-market-overview .market-chart-section { margin:8px 0 0; padding:0; border:0; border-radius:0; background:#fff; }
.market-chart-toolbar { gap:0; margin:0; border-bottom:1px solid #e7ebe9; background:#fff; }
.market-period-switch,
.market-indicator-switch { gap:0; }
.market-period-switch { padding:0 10px; border-bottom:1px solid #edf0ee; }
.market-indicator-switch { grid-template-columns:repeat(4,minmax(78px,1fr)); padding:0 10px; }
.market-period-switch button,
.market-indicator-switch button {
  position:relative;
  height:44px;
  padding:0 7px;
  border:0;
  border-radius:0;
  color:#737a77;
  background:transparent;
  font-size:11px;
}
.market-indicator-switch button { height:42px; }
.market-period-switch button.active,
.market-indicator-switch button.active { color:#202423; background:transparent; }
.market-period-switch button.active::after,
.market-indicator-switch button.active::after {
  content:"";
  position:absolute;
  right:14px;
  bottom:0;
  left:14px;
  height:3px;
  border-radius:3px 3px 0 0;
  background:#d7a22d;
}
.market-indicator-switch button.active::after { background:#0d796e; }
.market-indicator-switch button svg { width:15px; height:15px; }
.market-chart-legend { display:flex; min-height:38px; align-items:center; justify-content:space-between; gap:12px; padding:8px 14px 5px; background:#fff; }
.market-chart-legend > div { display:flex; min-width:0; align-items:center; gap:8px; font-size:10px; font-variant-numeric:tabular-nums; }
.market-chart-legend > div > strong { color:#252928; font-size:13px; }
.market-chart-legend span b,
.market-chart-legend small b { font:inherit; }
.market-chart-legend .ma30 { color:#6951c9; }
.market-chart-legend .ma60 { color:#d89b30; }
.market-chart-legend small { color:#7b827f; font-size:9px; }
.market-ohlc-readout { display:flex; min-height:28px; align-items:center; gap:10px; padding:3px 14px 6px; overflow-x:auto; color:#707976; background:#fff; font-size:9px; font-variant-numeric:tabular-nums; white-space:nowrap; scrollbar-width:none; }
.market-ohlc-readout::-webkit-scrollbar { display:none; }
.market-ohlc-readout b { color:#252928; font:inherit; font-weight:700; }
.market-ohlc-readout .coordinates { padding-right:8px; border-right:1px solid #e3e7e5; color:#0d796e; }
.market-period-countdown { display:inline-flex; align-items:center; gap:5px; margin-left:auto; color:#68716e; font-variant-numeric:tabular-nums; white-space:nowrap; }
.market-period-countdown small { font-size:9px; }
.market-period-countdown b { min-width:42px; color:#252928; font-size:11px; text-align:right; }
.market-chart-stage { height:470px; border-color:#edf0ee; background:#fff; }
.market-chart-stage .market-chart { height:470px; min-height:470px; }
.market-chart-section .jin10-loading { height:470px; }
.market-timeframe-watermark { color:rgba(89,105,99,.06); font-size:52px; }
.market-chart-move { top:10px; right:10px; border-color:#e0e5e2; background:rgba(255,255,255,.9); }
.market-lower-indicators { display:flex; min-height:38px; align-items:center; justify-content:space-between; gap:12px; padding:8px 14px; border-bottom:1px solid #edf0ee; background:#fff; font-size:10px; }
.market-lower-indicators strong { color:#272b2a; }
.market-lower-indicators span { color:#7b827f; }
.gold-market-overview .market-chart-section > p { margin:0; padding:10px 14px; color:#8a918e; background:#fff; font-size:9px; }

html[data-theme="dark"] .gold-market-overview { color:#e7ecea; background:#171b19; }
html[data-theme="dark"] .market-quote-board,
html[data-theme="dark"] .gold-market-overview .market-chart-section,
html[data-theme="dark"] .market-chart-toolbar,
html[data-theme="dark"] .market-chart-legend,
html[data-theme="dark"] .market-ohlc-readout,
html[data-theme="dark"] .market-chart-stage,
html[data-theme="dark"] .market-lower-indicators,
html[data-theme="dark"] .gold-market-overview .market-chart-section > p { border-color:#303734; background:#202522; }
html[data-theme="dark"] .market-symbol-title strong,
html[data-theme="dark"] .market-quote-matrix strong,
html[data-theme="dark"] .market-chart-legend > div > strong,
html[data-theme="dark"] .market-lower-indicators strong { color:#edf2f0; }
html[data-theme="dark"] .market-period-countdown b { color:#edf2f0; }
html[data-theme="dark"] .market-ohlc-readout b { color:#edf2f0; }
html[data-theme="dark"] .market-period-switch button,
html[data-theme="dark"] .market-indicator-switch button { border:0; color:#aab3af; background:transparent; }
html[data-theme="dark"] .market-period-switch button.active,
html[data-theme="dark"] .market-indicator-switch button.active { color:#fff; background:transparent; }

@media (max-width:520px) {
  .market-quote-board { padding:14px 12px 10px; }
  .market-symbol-title strong { font-size:18px; }
  .market-symbol-title span { font-size:14px; }
  .market-quote-summary { grid-template-columns:124px minmax(0,1fr); gap:10px; }
  .market-quote-primary .market-live-price { font-size:29px; }
  .market-quote-primary > span { font-size:11px; }
  .market-quote-matrix { gap:8px 10px; }
  .market-quote-matrix span { font-size:9px; }
  .market-quote-matrix strong { font-size:12px; }
  .market-period-switch { grid-template-columns:repeat(6,minmax(50px,1fr)); overflow-x:auto; }
  .market-indicator-switch { grid-template-columns:repeat(4,82px); overflow-x:auto; }
  .market-period-switch button,
  .market-indicator-switch button { padding:0 5px; font-size:10px; }
  .market-chart-stage,
  .market-chart-stage .market-chart { height:470px; min-height:470px; }
  .market-chart-legend { padding-right:10px; padding-left:10px; }
  .market-chart-legend > div { gap:6px; }
  .market-timeframe-watermark { font-size:44px; }
}

.calendar-row {
  grid-template-areas:"time star countdown" "copy copy copy";
  grid-template-columns:44px 38px minmax(0,1fr);
  align-items:start;
}
.calendar-time { grid-area:time; }
.calendar-star { grid-area:star; }
.calendar-countdown { grid-area:countdown; justify-self:end; padding-top:4px; }
.calendar-copy { grid-area:copy; padding-top:2px; }
.calendar-row.is-published { opacity:1; }
.calendar-impact-panel { display:grid; gap:7px; margin-top:12px; padding:11px; border:1px solid #dfe7e3; border-radius:9px; background:#f8faf9; }
.calendar-impact-panel > div { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.calendar-impact-panel > div span { color:#71807a; font-size:9px; }
.calendar-impact-panel > div strong { font-size:12px; }
.calendar-impact-panel p { margin:0; color:#53605c; font-size:10px; line-height:1.65; }
.calendar-impact-panel small { display:flex; align-items:center; gap:5px; color:#87918e; font-size:9px; }
.calendar-impact-panel small svg { width:12px; height:12px; }
.calendar-impact-panel.tone-positive { border-color:#b9ded5; background:#edf8f4; }
.calendar-impact-panel.tone-positive strong { color:#0d796e; }
.calendar-impact-panel.tone-negative { border-color:#efd0d3; background:#fff3f3; }
.calendar-impact-panel.tone-negative strong { color:#bd4f55; }
.calendar-awaiting-impact { display:flex; align-items:center; gap:6px; margin-top:10px; color:#87918e; font-size:9px; }
.calendar-awaiting-impact svg { width:13px; height:13px; }

.jin10-news-tags { display:flex; flex-wrap:wrap; gap:5px; margin-bottom:9px; }
.jin10-news-tags .jin10-topic { color:#0d796e; background:#e7f6f1; font-weight:700; }
.jin10-news-ai-preview { margin-top:10px; padding:10px; border-left:3px solid #96aaa4; border-radius:0 8px 8px 0; background:#f6f8f7; }
.jin10-news-ai-preview small { display:flex; align-items:center; gap:4px; color:#71807a; font-size:9px; }
.jin10-news-ai-preview small svg { width:12px; height:12px; }
.jin10-news-ai-preview p { display:-webkit-box; overflow:hidden; margin:6px 0; color:#46534f; font-size:10px; line-height:1.6; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.jin10-news-ai-preview strong { font-size:10px; }
.tone-positive { color:#0d796e; }
.tone-negative { color:#bd4f55; }
.tone-neutral { color:#72531c; }
.news-ai-panel { display:grid; gap:10px; margin-bottom:14px; padding:12px; border:1px solid #dfe7e3; border-radius:10px; background:#f7f9f8; }
.news-ai-panel header { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.news-ai-panel header span { display:flex; align-items:center; gap:6px; color:#0d796e; font-size:10px; font-weight:700; }
.news-ai-panel header svg { width:14px; height:14px; }
.news-ai-panel header small { color:#87918e; font-size:8px; }
.news-ai-panel > p { margin:0; color:#46534f; font-size:11px; line-height:1.7; }
.news-ai-panel > div { display:grid; gap:4px; padding-top:9px; border-top:1px solid #dfe7e3; }
.news-ai-panel > div strong { font-size:11px; }
.news-ai-panel > div span { color:#71807a; font-size:10px; line-height:1.6; }
.jin10-article-copy { color:#34413d; font-size:12px; line-height:1.85; }

.trading-notes-modal { width:min(680px,calc(100vw - 24px)); }
.trading-notes-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 16px; border-bottom:1px solid var(--line); }
.trading-notes-toolbar > span { color:var(--muted); font-size:10px; }
.trading-notes-toolbar .primary-button { min-height:38px; padding:0 12px; }
.trading-notes-toolbar svg { width:15px; height:15px; }
.trading-notes-list { max-height:min(65vh,620px); overflow-y:auto; padding:8px 14px 16px; }
.trading-note-row { display:grid; width:100%; min-height:72px; grid-template-columns:72px minmax(0,1fr) auto 18px; align-items:center; gap:10px; padding:10px 6px; border:0; border-bottom:1px solid var(--line); color:var(--ink); background:transparent; text-align:left; cursor:pointer; }
.trading-note-date { color:var(--muted); font-size:10px; font-variant-numeric:tabular-nums; }
.trading-note-main { min-width:0; }
.trading-note-main strong,.trading-note-main small { display:block; }
.trading-note-main strong { overflow:hidden; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.trading-note-main small { margin-top:5px; color:var(--muted); font-size:9px; }
.trading-note-row b { padding:4px 7px; border-radius:6px; font-size:9px; white-space:nowrap; }
.trading-note-row b.profit { color:#0d796e; background:#e7f6f1; }
.trading-note-row b.loss { color:#bd4f55; background:#fff0f0; }
.trading-note-row b.neutral { color:#72531c; background:#fff8ea; }
.trading-note-row > svg { width:15px; color:var(--muted); }
.trading-note-editor { padding:14px 16px 16px; }
.trading-note-editor-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.trading-note-editor-head strong { font-size:14px; }
.trading-note-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.trading-note-grid label { display:grid; gap:6px; color:var(--muted); font-size:10px; }
.trading-note-grid label.wide { grid-column:1/-1; }
.trading-note-grid input,.trading-note-grid select,.trading-note-grid textarea { width:100%; min-width:0; padding:10px 11px; border:1px solid var(--line); border-radius:9px; color:var(--ink); background:var(--panel); font:inherit; }
.trading-note-grid textarea { resize:vertical; line-height:1.65; }
.message-download-link { color:inherit; font-weight:700; text-decoration:underline; text-underline-offset:2px; overflow-wrap:anywhere; }

html[data-theme="dark"] .calendar-impact-panel,
html[data-theme="dark"] .jin10-news-ai-preview,
html[data-theme="dark"] .news-ai-panel { border-color:#39433f; background:#18201e; }
html[data-theme="dark"] .calendar-impact-panel p,
html[data-theme="dark"] .jin10-news-ai-preview p,
html[data-theme="dark"] .news-ai-panel > p,
html[data-theme="dark"] .jin10-article-copy { color:#d7dfdc; }

@media (max-width:760px) {
  .market-chart-section { padding:10px 6px; }
  .market-chart { min-height:340px; }
  .calendar-row { padding-right:12px; padding-left:12px; }
  .trading-note-row { grid-template-columns:64px minmax(0,1fr) 18px; }
  .trading-note-row b { grid-column:2; justify-self:start; }
  .trading-note-row > svg { grid-column:3; grid-row:1 / span 2; }
  .trading-note-grid { grid-template-columns:1fr; }
  .trading-note-grid label.wide { grid-column:auto; }
}

.message-row {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  content-visibility:auto;
  contain-intrinsic-size:auto 72px;
}

.message-column {
  min-width: 0;
  max-width: min(76%, calc(100% - 46px));
}

.message-bubble,
.message-bubble.attachment-bubble,
.message-bubble.image-bubble {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  overflow-wrap: anywhere;
  word-break: break-word;
}

@media (max-width: 760px) {
  .message-stream {
    width: 100%;
    max-width: 100%;
    padding-right: 14px;
    padding-left: 14px;
  }

  .message-column {
    max-width: min(76%, calc(100vw - 76px));
  }

  .outgoing .message-column {
    max-width: min(76%, calc(100vw - 28px));
  }

  .strategy-message-column {
    width: calc(100% - 40px);
    max-width: 430px;
  }
}

.message-column.strategy-message-column {
  width: min(86%, 430px);
  max-width: 430px;
}

@media (max-width: 420px) {
  .message-column.strategy-message-column {
    width: calc(100% - 40px);
    max-width: none;
  }
}

/* Chat capture, QR scanning, and emoji tools. */
.composer {
  grid-template-columns: 40px 40px 40px minmax(0, 1fr) 44px;
}

.composer.voice-mode > .emoji-picker-panel,
.composer.voice-mode > #emojiPickerButton {
  display: none;
}

.voice-hold-button {
  grid-column: 4 / 6;
}

.emoji-picker-panel {
  position: absolute;
  z-index: 4;
  bottom: calc(100% - 8px);
  left: clamp(18px, 4vw, 64px);
  display: grid;
  width: min(430px, calc(100% - clamp(36px, 8vw, 128px)));
  max-height: min(330px, 46vh);
  gap: 10px;
  padding: 12px;
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: 0 12px 32px rgba(20, 28, 36, 0.18);
}

.emoji-picker-panel[hidden] {
  display: none;
}

.emoji-picker-panel header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.emoji-picker-panel header strong {
  font-size: 12px;
}

.emoji-picker-panel header span,
.emoji-recent-section > small {
  color: var(--muted);
  font-size: 9px;
}

.emoji-recent-section {
  display: grid;
  gap: 6px;
  padding-bottom: 9px;
  border-bottom: 1px solid var(--line);
}

.emoji-grid {
  display: grid;
  grid-template-columns: repeat(8, 38px);
  gap: 4px;
}

.emoji-grid button {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  font-size: 23px;
  line-height: 1;
  cursor: pointer;
}

.emoji-grid button:hover,
.emoji-grid button:focus-visible {
  background: var(--accent-soft);
}

#emojiPickerButton.active {
  color: var(--accent-strong);
  background: var(--accent-soft);
}

.camera-capture-modal,
.qr-scanner-modal {
  width: min(480px, calc(100vw - 24px));
  overflow: hidden;
}

.camera-stage,
.qr-scanner-stage {
  position: relative;
  min-height: 320px;
  max-height: 64vh;
  overflow: hidden;
  background: #111514;
}

.camera-stage video,
.qr-scanner-stage video {
  display: block;
  width: 100%;
  height: min(64vh, 560px);
  min-height: 320px;
  object-fit: cover;
}

.camera-loading {
  position: absolute;
  right: 12px;
  bottom: 12px;
  left: 12px;
  padding: 8px 10px;
  color: white;
  background: rgba(10, 14, 13, 0.72);
  font-size: 11px;
  text-align: center;
}

.camera-actions,
.qr-scanner-actions {
  display: grid;
  align-items: center;
  gap: 12px;
  padding: 12px 16px max(12px, env(safe-area-inset-bottom));
  border-top: 1px solid var(--line);
}

.camera-actions {
  grid-template-columns: minmax(0, 1fr) 64px minmax(0, 1fr);
}

.camera-actions > .secondary-button {
  justify-self: start;
}

.camera-actions > .icon-button {
  justify-self: end;
}

.camera-shutter {
  display: grid;
  width: 62px;
  height: 62px;
  place-items: center;
  padding: 0;
  border: 3px solid var(--panel);
  border-radius: 50%;
  background: #d6e1dd;
  box-shadow: 0 0 0 2px #53615c;
  cursor: pointer;
}

.camera-shutter span {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: white;
}

.camera-shutter:active span {
  transform: scale(0.92);
}

.qr-scan-frame {
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(62vw, 260px);
  aspect-ratio: 1;
  border: 1px solid rgba(255, 255, 255, 0.48);
  transform: translate(-50%, -56%);
}

.qr-scan-frame::before,
.qr-scan-frame::after,
.qr-scan-frame span::before,
.qr-scan-frame span::after {
  position: absolute;
  width: 28px;
  height: 28px;
  border-color: #35c59a;
  border-style: solid;
  content: "";
}

.qr-scan-frame::before { top: -2px; left: -2px; border-width: 3px 0 0 3px; }
.qr-scan-frame::after { top: -2px; right: -2px; border-width: 3px 3px 0 0; }
.qr-scan-frame span::before { bottom: -2px; left: -2px; border-width: 0 0 3px 3px; }
.qr-scan-frame span::after { right: -2px; bottom: -2px; border-width: 0 3px 3px 0; }

.qr-result {
  display: grid;
  gap: 8px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
}

.qr-result[hidden] {
  display: none;
}

.qr-result > small {
  color: var(--muted);
  font-size: 9px;
}

.qr-result > p {
  max-height: 108px;
  margin: 0;
  padding: 10px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--soft);
  font-size: 12px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

.qr-result > div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.qr-result a[hidden] {
  display: none;
}

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

html[data-theme="dark"] .emoji-picker-panel {
  background: #18201e;
}

html[data-theme="dark"] .emoji-grid button:hover,
html[data-theme="dark"] .emoji-grid button:focus-visible {
  background: #24332f;
}

@media (max-width: 760px) {
  .composer {
    grid-template-columns: 38px 38px 38px minmax(0, 1fr) 42px;
  }

  .emoji-picker-panel {
    bottom: calc(100% - 4px);
    left: 12px;
    width: calc(100% - 24px);
  }

  .emoji-grid {
    grid-template-columns: repeat(8, minmax(34px, 1fr));
  }

  .emoji-grid button {
    width: 100%;
  }

  .camera-capture-modal,
  .qr-scanner-modal {
    width: calc(100vw - 16px);
    max-height: calc(100dvh - 16px);
  }
}

@media (max-width: 380px) {
  .composer {
    grid-template-columns: 36px 36px 36px minmax(0, 1fr) 40px;
    gap: 5px;
  }

  .composer-tool-button {
    width: 36px;
  }

  .emoji-grid {
    grid-template-columns: repeat(7, minmax(34px, 1fr));
  }
}

.conversation-load-state {
  display: grid;
  width: min(320px, calc(100% - 32px));
  min-height: 130px;
  margin: 56px auto;
  place-items: center;
  align-content: center;
  gap: 10px;
  color: #71807a;
  text-align: center;
}

.conversation-load-state svg {
  width: 25px;
  height: 25px;
  color: #0d796e;
}

.conversation-load-state:not(.error) svg {
  animation: spin 1s linear infinite;
}

.conversation-load-state strong,
.conversation-load-state span {
  display: block;
}

.conversation-load-state strong {
  color: var(--ink);
  font-size: 14px;
}

.conversation-load-state span {
  font-size: 12px;
  line-height: 20px;
}

.conversation-load-state button {
  min-height: 36px;
  padding: 0 16px;
  border: 0;
  border-radius: 7px;
  color: white;
  background: #0d796e;
  font-weight: 700;
  cursor: pointer;
}

/* h49: clearer market state, strategy lifecycle, compact news, and safer mobile dialogs. */
.mobile-unread-indicator[hidden] {
  display: none !important;
}

.market-data-health {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}

.market-data-health i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
}

.market-data-health.tone-live { color: #0d796e; }
.market-data-health.tone-delayed,
.market-data-health.tone-closed { color: #8a6a24; }
.market-data-health.tone-stale { color: #bd4f55; }
.market-data-health.tone-waiting { color: #7b827f; }
.market-ma-off { color: #8a918e; }

.strategy-lifecycle {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 14px 0 2px;
  padding: 0 2px;
  list-style: none;
}

.strategy-lifecycle li {
  position: relative;
  display: grid;
  min-width: 0;
  justify-items: center;
  gap: 5px;
  color: #929a97;
  font-size: 9px;
  text-align: center;
}

.strategy-lifecycle li:not(:last-child)::after {
  position: absolute;
  z-index: 0;
  top: 10px;
  left: calc(50% + 12px);
  width: calc(100% - 24px);
  height: 2px;
  background: #e2e7e5;
  content: "";
}

.strategy-lifecycle li i {
  position: relative;
  z-index: 1;
  display: grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border: 2px solid #dce3e0;
  border-radius: 50%;
  background: white;
  font-size: 8px;
  font-style: normal;
  font-weight: 800;
}

.strategy-lifecycle li.done,
.strategy-lifecycle li.current { color: #0d796e; font-weight: 700; }
.strategy-lifecycle li.done i,
.strategy-lifecycle li.current i { border-color: #0d796e; color: white; background: #0d796e; }
.strategy-lifecycle li.done::after { background: #77b9ac; }
.strategy-lifecycle.tone-warning li.current { color: #bd4f55; }
.strategy-lifecycle.tone-warning li.current i { border-color: #bd4f55; background: #bd4f55; }

.realtime-level-grid strong {
  overflow: visible;
  font-size: clamp(13px, 3.8vw, 16px);
  line-height: 1.25;
  overflow-wrap: anywhere;
  text-overflow: clip;
  white-space: normal;
}

.realtime-sample-warning {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 9px 0 0;
  padding: 8px 9px;
  border: 1px solid #ead9b3;
  border-radius: 7px;
  color: #76591d;
  background: #fff9ea;
  font-size: 9px;
}

.realtime-sample-warning svg { width: 13px; height: 13px; flex: none; }

.calendar-empty-state {
  display: grid;
  width: min(390px, calc(100% - 28px));
  min-height: 270px;
  margin: 28px auto;
  place-items: center;
  align-content: center;
  gap: 9px;
  padding: 26px;
  border: 1px solid #dfe7e3;
  border-radius: 8px;
  color: #71807a;
  background: white;
  text-align: center;
}

.calendar-empty-state > span {
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  border-radius: 8px;
  color: #0d796e;
  background: #e7f6f1;
}

.calendar-empty-state svg { width: 23px; height: 23px; }
.calendar-empty-state strong { color: var(--ink); font-size: 14px; }
.calendar-empty-state small { font-size: 10px; line-height: 1.6; }
.calendar-empty-state button { min-height: 34px; margin-top: 4px; }

.decision-tabs {
  position: relative;
  z-index: 2;
  margin-bottom: 8px;
}

.decision-content { position: relative; z-index: 1; }

.risk-calculator-grid label small {
  float: right;
  color: var(--muted);
  font-size: 9px;
  font-weight: 500;
}

.risk-calculator-help {
  margin: 0;
  padding: 0 18px 12px;
  color: var(--muted);
  font-size: 9px;
  line-height: 1.6;
}

.profile-setting-button#appVersionButton strong {
  max-width: 150px;
  font-size: 9px;
  line-height: 1.35;
  text-align: right;
  white-space: normal;
}

html[data-theme="dark"] .calendar-empty-state,
html[data-theme="dark"] .strategy-lifecycle li i { border-color: #39433f; color: var(--ink); background: #202522; }
html[data-theme="dark"] .strategy-lifecycle li.done i,
html[data-theme="dark"] .strategy-lifecycle li.current i { color: white; background: #0d796e; }
html[data-theme="dark"] .realtime-sample-warning { border-color: #66572f; color: #e8c77f; background: #332d1e; }

@media (max-width: 760px) {
  .jin10-news-item { padding: 10px 0; }
  .jin10-news-tags { gap: 4px; margin-bottom: 6px; }
  .jin10-news-ai-preview { margin-top: 7px; padding: 7px 8px; }
  .jin10-news-ai-preview p { margin: 4px 0; -webkit-line-clamp: 1; }
  .jin10-news-meta { margin-top: 5px; }

  .realtime-history-modal,
  .decision-history-modal,
  #riskCalculatorModal {
    max-height: calc(var(--app-height, 100dvh) - 18px);
    margin: auto;
  }

  .realtime-history-list,
  .decision-history-list {
    max-height: calc(var(--app-height, 100dvh) - 150px);
    padding-bottom: max(12px, env(safe-area-inset-bottom));
  }

  .realtime-history-modal .modal-header .secondary-button {
    min-height: 34px;
    padding: 0 9px;
    font-size: 10px;
  }

  .strategy-lifecycle li { font-size: 8px; }
  .calendar-empty-state { min-height: 230px; margin-top: 18px; }
}

/* h48: keep market gestures inside the chart and fit the market view on phones. */
.app-shell.market-open .jin10-pane,
.app-shell.market-open .jin10-content,
.app-shell.market-open .gold-market-overview {
  overscroll-behavior-x: none;
}

@media (max-width: 760px) {
  .app-shell.market-open .jin10-header {
    min-height: 54px;
    padding: 7px 12px;
  }

  .app-shell.market-open .jin10-heading p { max-width:150px; }
  .app-shell.market-open .jin10-header-quote { min-width:78px; padding:6px 7px; }
  .app-shell.market-open .jin10-header-price { font-size:15px; }

  .app-shell.market-open .jin10-tabs {
    margin: 6px 10px 0;
    padding: 3px;
  }

  .app-shell.market-open .jin10-tab {
    height: 30px;
    font-size: 11px;
  }

  .app-shell.market-open .jin10-content {
    padding-bottom: 0;
  }

  .gold-market-overview {
    min-height: 100%;
    padding-bottom: 0;
  }

  .market-quote-board {
    padding: 8px 10px 6px;
  }

  .market-quote-board > header {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 6px;
  }

  .market-symbol-title {
    gap: 5px;
  }

  .market-symbol-title strong {
    font-size: 16px;
  }

  .market-symbol-title span {
    font-size: 12px;
  }

  .market-symbol-title svg {
    width: 13px;
    height: 13px;
  }

  .market-symbol-meta {
    justify-content: flex-end;
    gap: 3px;
    font-size: 8px;
    white-space: nowrap;
  }

  .market-symbol-meta em,
  .market-symbol-meta span {
    padding: 2px 3px;
  }

  .market-quote-summary {
    grid-template-columns: 108px minmax(0, 1fr);
    gap: 8px;
    margin-top: 7px;
  }

  .market-quote-primary .market-live-price {
    font-size: 25px;
  }

  .market-quote-primary > span {
    margin-top: 3px;
    font-size: 10px;
  }

  .market-quote-matrix {
    gap: 4px 8px;
  }

  .market-quote-matrix > div {
    gap: 4px;
  }

  .market-quote-matrix span {
    font-size: 8px;
  }

  .market-quote-matrix strong {
    font-size: 11px;
  }

  .market-quote-board > footer {
    margin-top: 6px;
    padding-top: 4px;
    font-size: 8px;
  }

  .market-quote-board > footer strong {
    font-size: 9px;
  }

  .gold-market-overview .market-chart-section {
    margin-top: 4px;
  }

  .market-period-switch button {
    height: 32px;
  }

  .market-indicator-switch button {
    height: 30px;
  }

  .market-indicator-switch button svg {
    width: 12px;
    height: 12px;
  }

  .market-period-switch button.active::after,
  .market-indicator-switch button.active::after {
    right: 10px;
    left: 10px;
    height: 2px;
  }

  .market-chart-legend {
    min-height: 26px;
    padding: 3px 10px;
  }

  .market-chart-legend > div {
    gap: 5px;
    font-size: 9px;
  }

  .market-chart-legend > div > strong {
    font-size: 11px;
  }

  .market-chart-legend small {
    font-size: 8px;
  }

  .market-chart-stage,
  .market-chart-stage .market-chart {
    height: clamp(205px, calc(var(--app-height, 100dvh) - 450px), 280px);
    min-height: 205px;
  }

  .market-chart-section .jin10-loading {
    height: clamp(205px, calc(var(--app-height, 100dvh) - 450px), 280px);
    min-height: 205px;
  }

  .market-timeframe-watermark {
    font-size: 34px;
  }

  .market-chart-move {
    top: 6px;
    right: 6px;
    width: 24px;
    height: 24px;
  }

  .market-lower-indicators {
    min-height: 25px;
    padding: 4px 10px;
    font-size: 8px;
  }

  .gold-market-overview .market-chart-section > p {
    padding: 5px 10px;
    font-size: 8px;
  }
}

@media (max-width: 760px) {
  .market-chart-stage,
  .market-chart-stage .market-chart {
    height: clamp(225px, calc(var(--app-height, 100dvh) - 425px), 320px);
    min-height: 225px;
  }

  .market-chart-section .jin10-loading {
    height: clamp(225px, calc(var(--app-height, 100dvh) - 425px), 320px);
    min-height: 225px;
  }
}

/* h61: system camera handoff and an inline composer emoji control. */
.composer {
  grid-template-columns: 40px 40px minmax(0, 1fr) 44px;
}

.composer-input-shell {
  position: relative;
  display: flex;
  min-width: 0;
  align-items: flex-end;
}

.composer-input-shell textarea {
  padding-left: 46px;
}

.composer-emoji-button {
  position: absolute;
  z-index: 2;
  bottom: 2px;
  left: 3px;
  width: 38px;
  height: 40px;
  color: #697179;
  background: transparent;
}

.composer-emoji-button:hover,
#emojiPickerButton.active {
  color: var(--accent-strong);
  background: var(--accent-soft);
}

.emoji-picker-panel {
  position: static;
  grid-column: 1 / -1;
  width: 100%;
  max-height: min(250px, 36dvh);
  margin-top: 2px;
  box-shadow: none;
  overscroll-behavior: contain;
}

.composer.voice-mode > .composer-input-shell,
.composer.voice-mode > .send-button,
.composer.voice-mode > .emoji-picker-panel {
  display: none;
}

.voice-hold-button {
  grid-column: 3 / 5;
}

@media (max-width: 760px) {
  .composer {
    grid-template-columns: 38px 38px minmax(0, 1fr) 42px;
  }

  .emoji-picker-panel {
    width: 100%;
    max-height: min(230px, 34dvh);
  }
}

@media (max-width: 380px) {
  .composer {
    grid-template-columns: 36px 36px minmax(0, 1fr) 40px;
  }
}

/* h62: scanner lives with conversation creation and only opens the camera. */
.brand-actions #qrScannerButton {
  color: #166f66;
}

.brand-actions #qrScannerButton:hover,
.brand-actions #qrScannerButton:focus-visible {
  background: #e7f6f1;
}

.composer-media-menu {
  min-width: 218px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.qr-scanner-actions {
  grid-template-columns: minmax(0, 1fr);
}

.qr-scanner-actions .secondary-button {
  width: 100%;
}

/* h63: complete chat workflow and compact conversation controls. */
.chat-pane {
  grid-template-rows: auto auto auto minmax(0, 1fr) auto auto;
}

.typing-indicator {
  grid-row: 5;
  min-height: 26px;
  padding: 5px 18px;
  border-top: 1px solid var(--line);
  color: var(--accent-strong);
  background: rgba(255, 255, 255, .96);
  font-size: 12px;
}

.composer { grid-row: 6; }

.message-history-control,
.cached-message-notice {
  display: flex;
  justify-content: center;
  padding: 6px 0 12px;
}

.message-history-control button,
.cached-message-notice {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 0;
  color: #6d7875;
  background: transparent;
  font-size: 12px;
}

.message-history-control svg,
.cached-message-notice svg { width: 14px; height: 14px; }
.message-history-control button:disabled svg { animation: spin 900ms linear infinite; }

.composer-media-menu {
  min-width: 276px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.upload-progress {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, 1fr) 32px;
  gap: 5px 10px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid #dce7e3;
  border-radius: 7px;
  background: #f7fbf9;
}

.upload-progress[hidden] { display: none; }
.upload-progress > span { display:flex; justify-content:space-between; gap:10px; font-size:12px; }
.upload-progress > span small { color:var(--muted); }
.upload-progress progress { width:100%; height:5px; grid-column:1; accent-color:var(--accent-strong); }
.upload-progress .icon-button { grid-column:2; grid-row:1 / span 2; width:30px; height:30px; }

.message-video {
  display: block;
  width: min(290px, 64vw);
  max-height: 360px;
  border-radius: 6px;
  background: #111;
}

.video-bubble { padding: 4px !important; }
.voice-message-wrap { display:flex; align-items:center; gap:4px; }
.voice-message.unplayed::after { width:7px; height:7px; border-radius:50%; background:#df5b63; content:""; }
.voice-rate-button { min-width:34px; height:28px; padding:0 6px; border:0; border-radius:6px; color:#58706a; background:#eef4f2; font-size:11px; font-weight:700; }

.edited-label { margin-left:7px; color:#89918f; }
.message-reactions { display:flex; flex-wrap:wrap; gap:4px; margin-top:4px; }
.message-reaction { display:inline-flex; align-items:center; gap:4px; min-height:25px; padding:2px 8px; border:1px solid #dce6e2; border-radius:6px; color:#596662; background:#fff; }
.message-reaction.mine { border-color:#7fc7ba; color:#0d796e; background:#e8f6f2; }
.message-reaction b { font-size:11px; }
.reaction-quick-row { display:grid; grid-template-columns:repeat(4, 1fr); gap:7px; padding:0 20px 14px; }
.reaction-quick-row button { min-height:42px; border:1px solid var(--line); border-radius:7px; background:#f8faf9; font-size:20px; }

.compact-select,
.compact-input-action input {
  min-width: 0;
  height: 36px;
  border: 1px solid #dbe3e0;
  border-radius: 6px;
  color: var(--ink);
  background: #fff;
  font-size: 12px;
}

.compact-select { width:min(150px, 44vw); padding:0 8px; }
.compact-input-action { display:flex; width:min(180px, 48vw); gap:6px; }
.compact-input-action input { width:100%; padding:0 9px; }

.conversation-media-modal { width:min(720px, calc(100vw - 24px)); }
.media-filter-tabs { display:flex; gap:6px; padding:0 20px 14px; overflow-x:auto; }
.media-filter-tabs button { min-width:64px; height:34px; border:1px solid var(--line); border-radius:6px; color:var(--muted); background:#fff; }
.media-filter-tabs button.active { border-color:#75b9ae; color:#0d796e; background:#eaf6f2; }
.conversation-media-grid { display:grid; max-height:min(62dvh, 540px); grid-template-columns:repeat(3, minmax(0, 1fr)); gap:10px; padding:0 20px 16px; overflow-y:auto; }
.conversation-media-item { min-width:0; border:1px solid var(--line); border-radius:7px; overflow:hidden; color:var(--ink); background:#fff; }
.media-image-item { position:relative; aspect-ratio:1; padding:0; }
.media-image-item img { width:100%; height:100%; object-fit:cover; }
.media-image-item > span { position:absolute; right:5px; bottom:5px; padding:2px 5px; border-radius:4px; color:#fff; background:rgba(0,0,0,.55); font-size:10px; }
.media-video-item video { display:block; width:100%; aspect-ratio:16 / 10; background:#111; }
.media-video-item > span { display:block; padding:8px; }
.media-video-item strong,.media-video-item small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.media-video-item small { margin-top:3px; color:var(--muted); font-size:11px; }
.media-file-item { display:grid; grid-template-columns:30px minmax(0,1fr) 18px; align-items:center; gap:8px; padding:10px; }
.media-file-item svg { width:20px; }
.media-file-item strong,.media-file-item small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.media-file-item small { margin-top:3px; color:var(--muted); font-size:10px; }
.media-load-more { display:block; margin:0 auto 16px; }
.privacy-settings-content { display:grid; gap:0; padding:0 20px; }
.privacy-settings-content .setting-row { padding:15px 0; border-bottom:1px solid var(--line); }
.privacy-settings-content small { display:block; margin-top:4px; color:var(--muted); font-size:11px; }
.mention-all-avatar { display:grid; place-items:center; background:#e7f5f1; color:#0d796e; }
.mention-all-avatar svg { width:17px; height:17px; }

html[data-theme="dark"] .typing-indicator,
html[data-theme="dark"] .upload-progress,
html[data-theme="dark"] .message-reaction,
html[data-theme="dark"] .reaction-quick-row button,
html[data-theme="dark"] .compact-select,
html[data-theme="dark"] .compact-input-action input,
html[data-theme="dark"] .media-filter-tabs button,
html[data-theme="dark"] .conversation-media-item { color:#e6ecea; background:#202725; border-color:#35403d; }

@media (max-width: 600px) {
  .typing-indicator { padding:4px 12px; min-height:24px; }
  .composer-media-menu { min-width:min(276px, calc(100vw - 24px)); }
  .conversation-media-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); padding:0 12px 14px; }
  .compact-select { width:min(142px, 43vw); }
  .message-video { width:min(260px, 72vw); max-height:300px; }
}

/* h64: compact group/profile surfaces and collision-free strategy pricing. */
.profile-page-content .profile-content {
  display: grid;
  gap: 14px;
  padding: 16px;
}

.profile-summary {
  display: grid;
  min-width: 0;
  grid-template-columns: 58px minmax(0, 1fr) 34px 18px;
  align-items: center;
  gap: 10px;
  padding: 14px;
  border: 1px solid #dfe7e3;
  border-radius: 8px;
  background: var(--surface);
}

.profile-summary .profile-avatar {
  width: 58px;
  height: 58px;
  border: 0;
  border-radius: 12px;
}

.profile-summary-main {
  display: grid;
  min-width: 0;
  gap: 3px;
  padding: 0;
  border: 0;
  color: var(--ink);
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.profile-summary-main strong,
.profile-summary-main span,
.profile-summary-main small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.profile-summary-main strong { font-size: 17px; }
.profile-summary-main .profile-id { color: var(--muted); font-size: 11px; }
.profile-summary-main small { color: var(--accent-strong); font-size: 10px; }
.profile-summary > svg { width: 17px; height: 17px; color: var(--muted); }
.profile-summary .profile-copy-button { width: 34px; height: 34px; margin: 0; }

.profile-settings-groups {
  display: grid;
  gap: 14px;
}

.profile-settings-groups > section { min-width: 0; }
.profile-settings-groups > section > h3 {
  margin: 0 0 7px 4px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.profile-settings-groups .profile-settings-list {
  margin: 0;
  border-radius: 8px;
}

.profile-settings-groups .profile-setting-button {
  min-height: 50px;
  padding: 0 12px;
}

.profile-settings-groups .profile-setting-button + .profile-setting-button {
  border-top: 1px solid var(--line);
}

.profile-editor-modal form {
  display: flex;
  max-height: min(760px, calc(var(--app-height, 100dvh) - 24px));
  flex-direction: column;
}

.profile-editor-content {
  min-height: 0;
  justify-items: stretch;
  overflow-y: auto;
  padding: 16px 18px 4px;
}

.profile-editor-avatar-row {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 2px 2px 10px;
}

.profile-editor-avatar-row > span { display: grid; gap: 3px; }
.profile-editor-avatar-row > span strong { font-size: 14px; }
.profile-editor-avatar-row > span small { color: var(--muted); font-size: 10px; }
.profile-editor-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.profile-editor-wide { grid-column: 1 / -1; }
.profile-editor-fields textarea { resize: vertical; }

.user-profile-content {
  display: grid;
  justify-items: stretch;
  gap: 14px;
  padding: 18px 18px 4px;
}

.user-profile-identity {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  padding: 2px 2px 14px;
  border-bottom: 1px solid var(--line);
}

.user-profile-avatar { width: 72px; height: 72px; font-size: 22px; }
.user-profile-identity > div:last-child { display: grid; min-width: 0; gap: 5px; }
.user-profile-identity > div:last-child > strong { overflow: hidden; font-size: 19px; text-overflow: ellipsis; white-space: nowrap; }
.user-profile-identity button {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  gap: 5px;
  padding: 0;
  border: 0;
  color: var(--muted);
  background: transparent;
  font-size: 11px;
  cursor: pointer;
}
.user-profile-identity button svg { width: 13px; height: 13px; }
.user-profile-identity small { color: var(--accent-strong); font-size: 10px; }

.user-profile-details {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.user-profile-details > div { display: grid; min-width: 0; gap: 4px; padding: 12px; }
.user-profile-details > div + div { border-left: 1px solid var(--line); }
.user-profile-details .user-profile-bio { grid-column: 1 / -1; border-top: 1px solid var(--line); border-left: 0; }
.user-profile-details span { color: var(--muted); font-size: 10px; }
.user-profile-details strong { overflow-wrap: anywhere; font-size: 12px; line-height: 19px; }
.user-profile-details.profile-hidden { opacity: .72; }
.user-profile-actions { padding-top: 12px; }
.user-profile-actions button { min-width: min(180px, 100%); }

.settings-drawer .drawer-header { min-height: 66px; padding: 10px 16px; }
.settings-drawer .drawer-header h2 { overflow: hidden; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
.settings-drawer .drawer-content { display: grid; align-content: start; gap: 12px; padding: 12px 14px calc(16px + env(safe-area-inset-bottom)); }

.group-overview {
  display: grid;
  grid-template-columns: 50px minmax(0, 1fr) 32px;
  align-items: center;
  gap: 10px;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.group-overview-avatar {
  display: grid;
  width: 50px;
  height: 50px;
  place-items: center;
  border-radius: 11px;
  color: white;
  background: var(--accent-strong);
  font-size: 14px;
  font-weight: 800;
}

.group-overview > div { display: grid; min-width: 0; gap: 4px; }
.group-overview strong { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.group-overview small { color: var(--muted); font-size: 10px; }
.group-overview .mini-icon-button { width: 30px; height: 30px; }

.group-quick-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

.group-quick-actions button {
  display: grid;
  min-width: 0;
  min-height: 62px;
  place-items: center;
  gap: 3px;
  padding: 7px 5px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  background: var(--surface);
  font-size: 10px;
  cursor: pointer;
}

.group-quick-actions button svg { width: 19px; height: 19px; color: var(--accent-strong); }
.group-quick-actions button small { display: none; }

.settings-drawer .setting-section,
.settings-drawer .member-section {
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.settings-drawer .setting-section + .setting-section { padding-top: 0; }
.settings-drawer .setting-section > h3,
.settings-drawer .member-section > .member-heading,
.settings-drawer .group-join-requests > .member-heading {
  min-height: 38px;
  margin: 0;
  padding: 0 11px;
  border-bottom: 1px solid var(--line);
}

.group-settings-compact .setting-row {
  min-height: 58px;
  gap: 10px;
  padding: 8px 11px;
}

.group-settings-compact .setting-row + .setting-row { border-top: 1px solid var(--line); }
.group-settings-compact .setting-copy strong { margin: 0; font-size: 12px; }
.group-settings-compact .setting-copy span { margin-top: 2px; font-size: 9px; line-height: 14px; }
.group-settings-compact .compact-select { width: min(134px, 42vw); }
.group-settings-compact .compact-input-action { width: min(145px, 44vw); }

.settings-drawer .member-section { padding-bottom: 11px; }
.settings-drawer .member-heading-actions { gap: 5px; }
.settings-drawer .member-search { margin: 9px 10px; }
.settings-drawer #memberList { padding: 0 10px; }
.settings-drawer .member-expand-button { width: calc(100% - 20px); margin: 10px 10px 0; }
.settings-drawer .group-join-requests #groupJoinRequestList { padding: 0 10px 8px; }

.settings-drawer .drawer-danger-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 0;
  padding: 0;
  border: 0;
}
.settings-drawer .drawer-danger-actions button { min-width: 0; }

.strategy-price-track {
  height: max(210px, calc(var(--marker-count, 6) * 28px));
  margin: 10px 6px;
}

.strategy-price-marker {
  min-height: 24px;
  height: 24px;
  grid-template-columns: 58px minmax(24px, 1fr) 72px;
  transform: translateY(-50%);
}

.strategy-price-marker::before {
  top: 50%;
  transform: translate(-5px, -50%);
}

.strategy-price-marker.tone-current::before { transform: translate(-6px, -50%); }
.strategy-price-marker span,
.strategy-price-marker strong { line-height: 18px; white-space: nowrap; }

html[data-theme="dark"] .profile-summary,
html[data-theme="dark"] .profile-settings-groups .profile-settings-list,
html[data-theme="dark"] .user-profile-details,
html[data-theme="dark"] .group-overview,
html[data-theme="dark"] .group-quick-actions button,
html[data-theme="dark"] .settings-drawer .setting-section,
html[data-theme="dark"] .settings-drawer .member-section {
  border-color: #35403d;
  background: var(--surface);
}

@media (max-width: 480px) {
  .profile-page-content .profile-content { padding: 10px; }
  .profile-summary { grid-template-columns: 52px minmax(0, 1fr) 32px 16px; padding: 11px; }
  .profile-summary .profile-avatar { width: 52px; height: 52px; }
  .profile-editor-fields { grid-template-columns: 1fr; gap: 10px; }
  .profile-editor-wide { grid-column: auto; }
  .profile-editor-avatar-row { padding-bottom: 6px; }
  .profile-avatar-picker,
  .profile-avatar-picker > span { width: 72px; height: 72px; }
  .user-profile-identity { grid-template-columns: 64px minmax(0, 1fr); }
  .user-profile-avatar { width: 64px; height: 64px; }
  .settings-drawer .drawer-content { padding-right: 10px; padding-left: 10px; }
  .group-settings-compact .compact-select { width: 126px; }
  .group-settings-compact .compact-input-action { width: 132px; }
  .strategy-price-scale { padding: 10px; }
  .strategy-price-marker { grid-template-columns: 50px minmax(18px, 1fr) 62px; gap: 4px; }
  .strategy-price-marker strong { font-size: 11px; }
}

/* h75: quote-only key-level market, compact strategy zones, and live group quote. */
.chat-pane {
  grid-template-rows: auto auto auto auto 1fr auto;
}

.analysis-group-quote {
  display: grid;
  min-height: 54px;
  grid-row: 3;
  grid-template-columns: 34px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 10px;
  padding: 7px clamp(14px, 3vw, 24px);
  border-bottom: 1px solid #dce8e3;
  color: #26302c;
  background: #f2faf7;
  font-variant-numeric: tabular-nums;
}

.analysis-group-quote[hidden] { display: none; }
.analysis-group-quote-mark { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 7px; color: white; background: #167b6e; }
.analysis-group-quote-mark svg { width: 17px; height: 17px; }
.analysis-group-quote-copy { display: flex; min-width: 0; align-items: baseline; gap: 8px; }
.analysis-group-quote-copy small { color: #668078; font-size: 10px; white-space: nowrap; }
.analysis-group-quote-copy strong { font-size: 20px; line-height: 1; }
.analysis-group-quote-change { color: #63716c; font-size: 11px; font-weight: 700; white-space: nowrap; }
.analysis-group-quote.tone-up .analysis-group-quote-copy strong,
.analysis-group-quote.tone-up .analysis-group-quote-change { color: #c84e57; }
.analysis-group-quote.tone-down .analysis-group-quote-copy strong,
.analysis-group-quote.tone-down .analysis-group-quote-change { color: #238b68; }
.analysis-group-quote-state { display: flex; align-items: center; gap: 5px; color: #65736e; font-size: 9px; white-space: nowrap; }
.analysis-group-quote-state i { width: 6px; height: 6px; border-radius: 50%; background: #1d9b73; }
.analysis-group-quote-state b { font: inherit; }
.analysis-group-quote-state.tone-stale i,
.analysis-group-quote-state.tone-delayed i { background: #cf9a31; }
.analysis-group-quote-state.tone-waiting i,
.analysis-group-quote-state.tone-closed i { background: #89938f; }

.mute-banner { grid-row: 4; }
.chat-empty,
.message-stream { grid-row: 5; }
.composer { grid-row: 6; }

.gold-market-overview .market-level-section {
  margin-top: 4px;
  border-top: 1px solid #e4e9e7;
  border-bottom: 1px solid #e4e9e7;
  background: #fff;
}

.market-level-section > header {
  display: flex;
  min-height: 50px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 14px;
  border-bottom: 1px solid #edf0ef;
}
.market-level-section > header span,
.market-level-section > header strong,
.market-level-section > header small { display: block; }
.market-level-section > header strong { color: #252b29; font-size: 14px; }
.market-level-section > header small { margin-top: 2px; color: #7c8581; font-size: 9px; }
.market-level-section > header button { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border: 1px solid #dfe5e2; border-radius: 7px; color: #15796d; background: #f5f9f7; cursor: pointer; }
.market-level-section > header button svg { width: 16px; height: 16px; }

.market-level-axis {
  position: relative;
  height: 430px;
  overflow: hidden;
  background: #fff;
  font-variant-numeric: tabular-nums;
}
.market-level-axis::before {
  position: absolute;
  top: 18px;
  bottom: 18px;
  left: 50%;
  width: 1px;
  background: #dfe5e2;
  content: "";
}
.market-level-axis::after {
  position: absolute;
  top: 18px;
  bottom: 18px;
  left: calc(50% - 3px);
  width: 7px;
  border-top: 1px solid #dfe5e2;
  border-bottom: 1px solid #dfe5e2;
  content: "";
}
.market-level-line {
  position: absolute;
  right: 13px;
  left: 13px;
  z-index: 1;
  display: grid;
  min-height: 24px;
  grid-template-columns: minmax(74px, auto) minmax(24px, 1fr) minmax(76px, auto);
  align-items: center;
  gap: 8px;
  color: #67716d;
  transform: translateY(-50%);
}
.market-level-line > i { height: 1px; border-top: 1px dashed currentColor; opacity: .55; }
.market-level-name { overflow: hidden; font-size: 10px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.market-level-line > strong { font-size: 11px; text-align: right; white-space: nowrap; }
.market-level-line.tone-resistance { color: #c84e57; }
.market-level-line.tone-support { color: #238b68; }
.market-level-line.tone-pivot { color: #b07a18; }
.market-level-line.tone-entry,
.market-level-line.tone-target,
.market-level-line.tone-exit { color: #296fba; }
.market-level-line.tone-stop { color: #b54951; }
.market-level-line.tone-cluster { color: #5d687f; }

.market-current-line {
  position: absolute;
  top: 50%;
  right: 0;
  left: 0;
  z-index: 3;
  display: grid;
  grid-template-columns: auto minmax(22px, 1fr) minmax(130px, auto);
  align-items: center;
  gap: 9px;
  padding: 0 13px;
  color: #f5f8f7;
  transform: translateY(-50%);
}
.market-current-line > span { min-width: 116px; padding: 7px 10px; border-radius: 6px; background: #1a655d; box-shadow: 0 3px 10px rgba(26, 101, 93, .18); }
.market-current-line small,
.market-current-line strong { display: block; }
.market-current-line small { color: #d5ebe6; font-size: 8px; }
.market-current-line strong { margin-top: 2px; font-size: 18px; line-height: 1; }
.market-current-line > i { height: 2px; background: #1a655d; }
.market-current-line > b { overflow: hidden; padding: 6px 8px; border: 1px solid #cce5df; border-radius: 6px; color: #155f57; background: #eef8f5; font-size: 10px; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.market-level-empty { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 8px; color: #7a8581; font-size: 11px; }
.market-level-empty svg { width: 24px; height: 24px; color: #297d70; }

.market-level-section > footer { display: flex; min-height: 38px; align-items: center; gap: 12px; padding: 7px 14px; border-top: 1px solid #edf0ef; color: #727d78; font-size: 9px; }
.market-level-section > footer span { display: flex; align-items: center; gap: 4px; white-space: nowrap; }
.market-level-section > footer i { width: 8px; height: 3px; border-radius: 2px; }
.market-level-section > footer .tone-resistance { background: #c84e57; }
.market-level-section > footer .tone-support { background: #238b68; }
.market-level-section > footer .tone-strategy { background: #296fba; }
.market-level-section > footer small { margin-left: auto; text-align: right; }

html[data-theme="dark"] .analysis-group-quote { border-color: #2d423c; color: #e5ece9; background: #18312b; }
html[data-theme="dark"] .analysis-group-quote-copy small,
html[data-theme="dark"] .analysis-group-quote-state { color: #9eb6ae; }
html[data-theme="dark"] .gold-market-overview .market-level-section,
html[data-theme="dark"] .market-level-axis { border-color: #303734; background: #202522; }
html[data-theme="dark"] .market-level-section > header,
html[data-theme="dark"] .market-level-section > footer { border-color: #303734; }
html[data-theme="dark"] .market-level-section > header strong { color: #edf2f0; }
html[data-theme="dark"] .market-level-axis::before,
html[data-theme="dark"] .market-level-axis::after { border-color: #3a4541; background: #3a4541; }
html[data-theme="dark"] .market-current-line > b { border-color: #2e5e54; color: #b9e0d7; background: #1b3932; }

@media (max-width: 520px) {
  .analysis-group-quote { min-height: 48px; grid-template-columns: 30px minmax(0, 1fr) auto; gap: 7px; padding: 6px 10px; }
  .analysis-group-quote-mark { width: 28px; height: 28px; }
  .analysis-group-quote-copy { gap: 5px; }
  .analysis-group-quote-copy small { font-size: 8px; }
  .analysis-group-quote-copy strong { font-size: 17px; }
  .analysis-group-quote-change { font-size: 9px; }
  .analysis-group-quote-state { display: none; }
  .market-level-section > header { min-height: 44px; padding: 6px 10px; }
  .market-level-axis { height: clamp(330px, calc(var(--app-height, 100dvh) - 338px), 460px); min-height: 330px; }
  .market-level-line { right: 9px; left: 9px; grid-template-columns: minmax(64px, auto) minmax(16px, 1fr) minmax(67px, auto); gap: 5px; }
  .market-level-name { font-size: 9px; }
  .market-level-line > strong { font-size: 9px; }
  .market-current-line { grid-template-columns: 106px minmax(12px, 1fr) minmax(112px, auto); gap: 5px; padding: 0 9px; }
  .market-current-line > span { min-width: 106px; padding: 6px 8px; }
  .market-current-line strong { font-size: 16px; }
  .market-current-line > b { max-width: 138px; padding: 5px 6px; font-size: 8px; }
  .market-level-section > footer { gap: 8px; padding: 6px 10px; }
  .market-level-section > footer small { overflow: hidden; max-width: 140px; text-overflow: ellipsis; white-space: nowrap; }
}

/* h75 cascade: the compact zone layout supersedes the former vertical axis. */
.market-level-axis {
  height: auto;
  min-height: 0;
  overflow: visible;
  padding: 0 10px 10px;
  background: #fff;
}
.market-level-axis::before,
.market-level-axis::after { display: none; }
html[data-theme="dark"] .market-level-axis { background: #202522; }
@media (max-width: 520px) {
  .market-level-axis { height: auto; min-height: 0; padding: 0 8px 9px; }
  .market-intraday-plan { margin-inline: 8px; }
  .market-zone-band { min-height: 44px; padding: 6px 8px; }
  .market-zone-band > strong { font-size: 10px; }
  .market-zone-markers { gap: 3px 8px; }
  .market-risk-scale footer { gap: 5px; }
  .market-risk-scale footer strong { font-size: 9px; }
}

/* h76 final cascade: keep the entire market workspace inside one phone viewport. */
.market-live-price,
.analysis-group-quote-copy strong,
#marketZoneCurrentPrice {
  min-width: 7ch;
  font-variant-numeric: tabular-nums;
}

@media (max-width: 760px) {
  .jin10-content.market-single-screen {
    min-height: 0;
    overflow: hidden;
    padding: 0;
  }
  .market-single-screen .gold-market-overview {
    display: grid;
    width: 100%;
    height: 100%;
    min-height: 0;
    grid-template-rows: auto minmax(0, 1fr);
    margin: 0;
    padding: 0;
    overflow: hidden;
  }
  .market-single-screen .market-quote-board { padding: 5px 10px 4px; }
  .market-single-screen .market-quote-board > header {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: space-between;
    gap: 7px;
  }
  .market-single-screen .market-symbol-title { gap: 5px; }
  .market-single-screen .market-symbol-title strong { font-size: 14px; }
  .market-single-screen .market-symbol-title span { font-size: 10px; }
  .market-single-screen .market-symbol-title svg { display: none; }
  .market-single-screen .market-symbol-meta { justify-content: flex-end; gap: 4px; font-size: 8px; }
  .market-single-screen .market-symbol-meta em,
  .market-single-screen .market-symbol-meta span { padding: 2px 4px; }
  .market-single-screen .market-quote-summary {
    grid-template-columns: 102px minmax(0, 1fr);
    gap: 7px;
    margin-top: 4px;
  }
  .market-single-screen .market-quote-primary .market-live-price { font-size: 23px; }
  .market-single-screen .market-quote-primary > span { margin-top: 2px; font-size: 8px; }
  .market-single-screen .market-quote-matrix { gap: 2px 7px; }
  .market-single-screen .market-quote-matrix > div { gap: 4px; }
  .market-single-screen .market-quote-matrix span { font-size: 8px; }
  .market-single-screen .market-quote-matrix strong { font-size: 9px; }
  .market-single-screen .market-quote-board > footer { margin-top: 3px; padding-top: 3px; font-size: 7px; }
  .market-single-screen .market-quote-board > footer strong { font-size: 7px; }
  .market-single-screen .market-level-section {
    display: flex;
    min-height: 0;
    flex-direction: column;
    margin-top: 0;
    overflow: hidden;
  }
  .market-single-screen .market-level-section > header { min-height: 31px; padding: 2px 8px; }
  .market-single-screen .market-level-section > header strong { font-size: 11px; }
  .market-single-screen .market-level-section > header small { margin-top: 0; font-size: 7px; }
  .market-single-screen .market-level-section > header button { width: 27px; height: 27px; }
  .market-single-screen .market-intraday-plan {
    min-height: 42px;
    margin: 3px 8px;
    padding: 4px 7px;
  }
  .market-single-screen .market-intraday-plan header { font-size: 9px; }
  .market-single-screen .market-intraday-plan header em { padding: 1px 5px; font-size: 7px; }
  .market-single-screen .market-intraday-plan p {
    overflow: hidden;
    margin: 2px 0;
    font-size: 8px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .market-single-screen .market-intraday-plan footer { font-size: 7px; }
  .market-single-screen .market-level-axis {
    display: flex;
    height: auto;
    min-height: 0;
    flex: 1;
    flex-direction: column;
    padding: 0 8px 3px;
    overflow: hidden;
  }
  .market-single-screen .market-zone-current {
    min-height: 29px;
    margin-bottom: 3px;
    padding: 2px 7px;
  }
  .market-single-screen .market-zone-current small { font-size: 7px; }
  .market-single-screen .market-zone-current b { font-size: 8px; }
  .market-single-screen .market-zone-current > strong { font-size: 14px; }
  .market-single-screen .market-zone-bands {
    display: grid;
    min-height: 0;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 3px;
  }
  .market-single-screen .market-zone-band {
    display: flex;
    min-width: 0;
    min-height: 48px;
    align-items: stretch;
    justify-content: center;
    flex-direction: column;
    gap: 1px;
    padding: 2px 5px;
  }
  .market-single-screen .market-zone-name { font-size: 7px; }
  .market-single-screen .market-zone-band > strong {
    overflow: hidden;
    font-size: 8px;
    text-align: left;
    text-overflow: ellipsis;
  }
  .market-single-screen .market-zone-band > small { display: none; }
  .market-single-screen .market-zone-band.is-current > small {
    display: block;
    overflow: hidden;
    font-size: 7px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .market-single-screen .market-zone-markers {
    display: flex;
    overflow: hidden;
    flex-wrap: nowrap;
    gap: 3px;
    padding-top: 1px;
    white-space: nowrap;
  }
  .market-single-screen .market-zone-markers span,
  .market-single-screen .market-zone-markers b { font-size: 7px; }
  .market-single-screen .market-risk-scale { margin-top: 3px; padding-top: 3px; }
  .market-single-screen .market-risk-labels,
  .market-single-screen .market-risk-scale footer { font-size: 7px; }
  .market-single-screen .market-risk-labels b,
  .market-single-screen .market-risk-scale footer strong { font-size: 7px; }
  .market-single-screen .market-risk-track { height: 4px; margin: 2px 0; }
  .market-single-screen .market-level-section > footer {
    min-height: 21px;
    gap: 5px;
    padding: 2px 8px;
    font-size: 7px;
  }
  .market-single-screen .market-level-section > footer small { max-width: 110px; font-size: 7px; }
}

@media (max-width: 350px), (max-height: 680px) and (max-width: 760px) {
  .market-single-screen .market-symbol-meta time,
  .market-single-screen .market-level-section > header small,
  .market-single-screen .market-level-section > footer small { display: none; }
  .market-single-screen .market-quote-board > footer { display: none; }
  .market-single-screen .market-zone-band { min-height: 43px; }
  .market-single-screen .market-intraday-plan { min-height: 39px; }
}

/* h77: fill the mobile market viewport instead of leaving a blank middle area. */
@media (max-width: 760px) {
  .app-shell.market-open .jin10-header {
    min-height: 50px;
    padding: 5px 10px;
  }
  .app-shell.market-open .jin10-mark { width: 38px; height: 38px; }
  .app-shell.market-open .jin10-heading h2 { font-size: 15px; }
  .app-shell.market-open .jin10-heading p { font-size: 9px; }
  .app-shell.market-open .jin10-header-quote { display: none !important; }
  .app-shell.market-open .jin10-refresh { width: 38px; height: 38px; }
  .app-shell.market-open .jin10-tabs {
    height: 40px;
    min-height: 40px;
    margin: 0;
    padding: 3px 8px;
    border-radius: 0;
  }
  .app-shell.market-open .jin10-tab { height: 34px; }
  .market-single-screen .market-quote-board { padding: 4px 10px 3px; }
  .market-single-screen .market-quote-summary { margin-top: 3px; }
  .market-single-screen .market-level-section > header { min-height: 30px; }
  .market-single-screen .market-intraday-plan { margin: 3px 8px; }
  .market-single-screen .market-level-axis {
    display: grid;
    min-height: 0;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 3px;
    padding: 0 8px 4px;
  }
  .market-single-screen .market-zone-current { margin: 0; }
  .market-single-screen .market-zone-bands {
    display: grid;
    height: 100%;
    min-height: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(3, minmax(44px, 1fr));
    gap: 4px;
  }
  .market-single-screen .market-zone-band {
    min-height: 0;
    justify-content: center;
    padding: 4px 7px;
  }
  .market-single-screen .market-zone-name { font-size: 8px; }
  .market-single-screen .market-zone-band > strong { font-size: 10px; }
  .market-single-screen .market-zone-band.is-current > small { font-size: 7px; }
  .market-single-screen .market-zone-markers {
    flex-wrap: wrap;
    white-space: normal;
  }
  .market-single-screen .market-zone-markers span,
  .market-single-screen .market-zone-markers b { font-size: 8px; }
  .market-single-screen .market-risk-scale {
    margin: 0;
    padding-top: 3px;
  }
  .market-single-screen .market-level-section > footer { min-height: 20px; }
}

@media (max-height: 680px) and (max-width: 760px) {
  .app-shell.market-open .jin10-header { min-height: 46px; }
  .app-shell.market-open .jin10-mark { width: 34px; height: 34px; }
  .app-shell.market-open .jin10-tabs { height: 36px; min-height: 36px; }
  .app-shell.market-open .jin10-tab { height: 30px; }
  .market-single-screen .market-zone-bands { grid-template-rows: repeat(3, minmax(38px, 1fr)); }
  .market-single-screen .market-zone-band { padding-block: 2px; }
}

/* h92: MT5 key-level context and automatic strategy settlement. */
.realtime-auto-settlement {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  padding: 11px 12px;
  border: 1px solid #cfe1dd;
  border-radius: 7px;
  color: #225f56;
  background: #f1f8f6;
}
.realtime-auto-settlement > svg { width: 17px; height: 17px; flex: 0 0 auto; margin-top: 1px; }
.realtime-auto-settlement > div { display: grid; gap: 3px; min-width: 0; }
.realtime-auto-settlement strong { font-size: 11px; }
.realtime-auto-settlement span { color: #6e7b77; font-size: 9px; line-height: 1.5; }

.daily-levels-live {
  display: grid;
  grid-template-columns: minmax(108px, .72fr) minmax(0, 1.28fr);
  align-items: center;
  gap: 10px;
  padding: 10px 13px;
  border-bottom: 1px solid #dce8e4;
  color: #fff;
  background: #123f39;
}
.daily-levels-live > span,
.daily-levels-live > p { display: grid; gap: 2px; min-width: 0; margin: 0; }
.daily-levels-live small { color: #a9c9c2; font-size: 8px; }
.daily-levels-live strong { color: #f2cf76; font-size: 20px; font-variant-numeric: tabular-nums; }
.daily-levels-live p { padding-left: 10px; border-left: 1px solid rgba(255,255,255,.15); }
.daily-levels-live p b { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }

.realtime-trade-ledger { margin-top: 10px; }
.realtime-ledger-list { display: grid; gap: 1px; margin-top: 11px; overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: var(--line); }
.realtime-ledger-list article {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  min-height: 52px;
  padding: 8px 10px;
  background: var(--surface);
}
.realtime-ledger-list time { color: var(--muted); font-size: 9px; }
.realtime-ledger-list article > span { display: grid; gap: 3px; min-width: 0; }
.realtime-ledger-list article > span b { font-size: 10px; }
.realtime-ledger-list article > span small { overflow: hidden; color: var(--muted); font-size: 10px; font-variant-numeric: tabular-nums; text-overflow: ellipsis; white-space: nowrap; }
.realtime-ledger-list article > strong { display: grid; gap: 2px; color: #168169; font-size: 9px; text-align: right; }
.realtime-ledger-list article.loss > strong { color: #c94c55; }
.realtime-ledger-list article > strong em { font-size: 14px; font-style: normal; font-variant-numeric: tabular-nums; }

.realtime-performance-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.realtime-performance-grid > div {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  grid-template-areas: "icon label" "icon value";
  align-items: center;
  column-gap: 7px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--canvas);
}
.realtime-performance-grid svg { grid-area: icon; width: 16px; height: 16px; color: #177d77; }
.realtime-performance-grid span { grid-area: label; color: var(--muted); font-size: 8px; }
.realtime-performance-grid > div > strong { grid-area: value; margin-top: 2px; font-size: 12px; }
.realtime-performance-grid .direction-rate > strong { display: flex; gap: 8px; }
.realtime-performance-grid .direction-rate > strong b { font-size: 10px; }

html[data-theme="dark"] .realtime-auto-settlement,
html[data-theme="dark"] .realtime-performance-grid > div { color: var(--ink); border-color: var(--line); background: #202a27; }

@media (max-width: 420px) {
  .realtime-stats-page { padding-inline: 10px; }
  .realtime-ledger-list article { grid-template-columns: 55px minmax(0, 1fr) auto; gap: 6px; padding-inline: 8px; }
  .realtime-performance-grid > div { padding: 8px; }
}

/* h82: focused market hierarchy, daily levels card, and strict avatar clipping. */
.avatar,
.small-avatar,
.message-avatar,
.profile-avatar,
.user-profile-avatar,
.profile-avatar-picker > span,
#profileAvatarPreview {
  overflow: hidden;
  isolation: isolate;
}

.avatar img,
.small-avatar img,
.message-avatar img,
.profile-avatar img,
.user-profile-avatar img,
.profile-avatar-picker img,
#profileAvatarPreview img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: 100%;
  max-height: 100%;
  margin: 0 !important;
  border: 0;
  border-radius: inherit;
  object-fit: cover;
  object-position: center;
  transform: none !important;
}

.market-current-zone {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 1px 7px;
  margin-top: 8px;
  padding: 7px 9px;
  border-left: 3px solid #177d77;
  border-radius: 4px;
  background: #f0f7f5;
}

.market-current-zone small { grid-row: 1; color: #77827e; font-size: 8px; }
.market-current-zone b { grid-column: 1 / -1; color: #155f57; font-size: 11px; }
.market-current-zone em { grid-row: 1; grid-column: 2; justify-self: end; color: #177d77; font-size: 10px; font-style: normal; font-weight: 800; }

.market-key-levels {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 5px;
}

.market-key-level {
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 66px;
  align-content: center;
  gap: 8px;
  padding: 8px;
  border: 1px solid #e3e8e5;
  border-radius: 5px;
  background: #fff;
}

.market-key-level span { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 4px; font-size: 10px; font-weight: 800; }
.market-key-level span small { overflow: hidden; color: #8a938f; font-size: 8px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.market-key-level strong { font-size: 13px; font-variant-numeric: tabular-nums; }
.market-key-level.tone-resistance strong { color: #b54f58; }
.market-key-level.tone-support strong { color: #178066; }
.market-key-level.tone-pivot { background: #fffaf0; }
.market-key-level.tone-pivot strong { color: #8c691e; }
.market-key-level.is-nearest { border-color: #247d71; box-shadow: inset 0 0 0 1px #247d71; background: #f1f8f6; }
.market-key-level.is-nearest::after { position: absolute; top: -1px; right: 6px; padding: 1px 4px; border-radius: 0 0 3px 3px; color: white; background: #247d71; content: "邻近"; font-size: 7px; }

.daily-levels-message {
  width: min(392px, calc(100% - 24px));
  margin: 10px auto;
  overflow: hidden;
  border: 1px solid #d7e4df;
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 8px 20px rgba(30, 77, 67, .08);
}

.daily-levels-message > header,
.daily-levels-message > footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.daily-levels-message > header { padding: 11px 13px; color: white; background: #155f57; }
.daily-levels-message > header span { display: flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 800; }
.daily-levels-message > header svg { width: 15px; height: 15px; }
.daily-levels-message > header time { color: #cce3dc; font-size: 9px; }
.daily-levels-pivot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px; border-bottom: 1px solid #edf0ee; background: #f4f9f7; }
.daily-levels-pivot span { display: grid; gap: 2px; }
.daily-levels-pivot small { color: #6f7c77; font-size: 9px; }
.daily-levels-pivot strong { color: #155f57; font-size: 22px; font-variant-numeric: tabular-nums; }
.daily-levels-pivot em { color: #75817c; font-size: 9px; font-style: normal; }
.daily-levels-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; padding: 1px 12px; background: #edf0ee; }
.daily-levels-grid span { display: grid; gap: 3px; padding: 10px 8px; background: #fff; text-align: center; }
.daily-levels-grid small { color: #848e89; font-size: 8px; }
.daily-levels-grid b { font-size: 13px; font-variant-numeric: tabular-nums; }
.daily-levels-grid.resistance b { color: #b54f58; }
.daily-levels-grid.support b { color: #178066; }
.daily-levels-message > footer { padding: 9px 13px; color: #7d8782; font-size: 8px; }

html[data-theme="dark"] .market-current-zone,
html[data-theme="dark"] .market-key-level.is-nearest { background: #183a32; }
html[data-theme="dark"] .market-key-level,
html[data-theme="dark"] .daily-levels-message,
html[data-theme="dark"] .daily-levels-grid span { border-color: #34413c; background: #202725; }
html[data-theme="dark"] .market-key-level.tone-pivot { background: #332f22; }
html[data-theme="dark"] .daily-levels-pivot { border-color: #34413c; background: #1c332d; }
html[data-theme="dark"] .daily-levels-grid { background: #34413c; }

@media (max-width: 760px) {
  .market-single-screen .gold-market-overview { height: auto; grid-template-rows: auto auto; align-content: start; }
  .market-single-screen .market-quote-summary { grid-template-columns: 122px minmax(0, 1fr); }
  .market-single-screen .market-current-zone { margin-top: 4px; padding: 4px 6px; }
  .market-single-screen .market-current-zone small { font-size: 7px; }
  .market-single-screen .market-current-zone b { font-size: 9px; }
  .market-single-screen .market-current-zone em { font-size: 8px; }
  .market-single-screen .market-level-section > header { min-height: 34px; padding: 3px 10px; }
  .market-single-screen .market-intraday-plan { min-height: 48px; margin: 4px 10px; padding: 5px 8px; }
  .market-single-screen .market-level-axis { display: grid; height: auto; min-height: 0; flex: 0 0 auto; grid-template-rows: auto auto; gap: 5px; padding: 0 10px 5px; }
  .market-single-screen .market-key-levels { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: 48px 40px 48px; gap: 4px; }
  .market-single-screen .market-key-level { min-height: 0; gap: 2px; padding: 5px 7px; }
  .market-single-screen .market-key-level span { font-size: 9px; }
  .market-single-screen .market-key-level span small { font-size: 7px; }
  .market-single-screen .market-key-level strong { font-size: 11px; }
  .market-single-screen .market-key-level.tone-pivot { grid-column: 1 / -1; grid-template-columns: auto 1fr; align-items: center; align-content: center; }
  .market-single-screen .market-key-level.tone-pivot span { justify-content: flex-start; gap: 6px; }
  .market-single-screen .market-key-level.tone-pivot strong { justify-self: end; font-size: 13px; }
  .market-single-screen .market-risk-scale { margin: 0; padding-top: 4px; }
  .market-single-screen .market-level-section > footer { min-height: 22px; }
}

@media (max-height: 680px) and (max-width: 760px) {
  .market-single-screen .market-quote-primary .market-live-price { font-size: 21px; }
  .market-single-screen .market-current-zone { padding-block: 2px; }
  .market-single-screen .market-intraday-plan { min-height: 41px; margin-block: 2px; }
  .market-single-screen .market-key-levels { grid-template-rows: 43px 36px 43px; }
  .market-single-screen .market-key-level { padding-block: 3px; }
}

/* h83: daily analysis on market, four-tab navigation, and one-screen strategy. */
.mobile-nav { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.market-analysis-actions { display: flex; align-items: center; gap: 6px; }
.market-analysis-actions button,
.realtime-head-actions button {
  display: grid;
  width: 32px;
  height: 32px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid #dfe5e2;
  border-radius: 6px;
  color: #15796d;
  background: #f5f9f7;
  cursor: pointer;
}
.market-analysis-actions button svg,
.realtime-head-actions button svg { width: 15px; height: 15px; }
.market-daily-analysis { margin: 8px 12px 7px; padding: 10px 12px; border: 1px solid #dfe7e4; border-left: 3px solid #177d77; border-radius: 6px; background: #f8fbfa; }
.market-analysis-copy { min-width: 0; }
.market-analysis-copy > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.market-analysis-stance { overflow: hidden; color: #176f65; font-size: 11px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.market-analysis-copy time { flex: 0 0 auto; color: #87918d; font-size: 8px; }
.market-analysis-copy p { display: -webkit-box; overflow: hidden; margin: 6px 0 0; color: #4f5b57; font-size: 11px; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.market-level-section > footer .tone-pivot { background: #b18531; }
.market-level-section > header > span { min-width: 0; }

.realtime-content.compact-current { overflow: hidden; }
.realtime-compact-page { height: 100%; min-height: 0; padding: 9px 12px 10px; }
.realtime-compact-card { display: grid; height: 100%; min-height: 0; grid-template-rows: auto auto auto auto auto auto auto; align-content: start; gap: 7px; padding: 10px 11px; overflow: hidden; }
.realtime-compact-head { min-width: 0; }
.realtime-compact-head > div:first-child { min-width: 0; }
.realtime-compact-kicker { display: block; overflow: hidden; margin-bottom: 2px; color: #6f7e79; font-size: 8px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.realtime-compact-head h3 { display: flex; align-items: center; gap: 6px; font-size: 15px; }
.realtime-compact-head h3 .realtime-direction { padding: 2px 6px; font-size: 8px; font-style: normal; }
.realtime-compact-head p { margin-top: 2px; font-size: 8px; }
.realtime-head-actions { display: flex; align-items: center; gap: 5px; }
.realtime-status-badge { padding: 4px 7px; border-radius: 5px; color: #267665; background: #e7f3f1; font-size: 9px; font-weight: 800; white-space: nowrap; }
.realtime-head-actions button { width: 28px; height: 28px; }
.compact-lifecycle { margin: 0; padding: 5px 4px 1px; }
.compact-lifecycle li span { font-size: 8px; }
.compact-lifecycle li i { width: 17px; height: 17px; font-size: 8px; }
.realtime-compact-levels { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; margin: 0; }
.realtime-compact-levels > div { min-width: 0; min-height: 51px; padding: 7px 8px; }
.realtime-compact-levels .exit { grid-column: auto; }
.realtime-compact-levels small { font-size: 8px; }
.realtime-compact-levels strong { display: -webkit-box; overflow: hidden; margin-top: 3px; font-size: 12px; line-height: 1.2; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.realtime-risk-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid #e4e9e7; border-radius: 6px; background: #e4e9e7; }
.realtime-risk-summary span { display: grid; gap: 2px; min-width: 0; padding: 6px 7px; background: #f7f9f8; }
.realtime-risk-summary small { color: #7b8581; font-size: 7px; }
.realtime-risk-summary b { overflow: hidden; color: #28312e; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.compact-location { min-height: 0; margin: 0; padding: 7px 8px; border-radius: 6px; }
.compact-location > svg { width: 14px; height: 14px; }
.compact-location div { gap: 1px; }
.compact-location strong { display: -webkit-box; overflow: hidden; font-size: 9px; line-height: 1.3; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.compact-location span { overflow: hidden; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.compact-note { min-height: 0; margin: 0; padding: 7px 8px; }
.compact-note div strong { font-size: 9px; }
.compact-note div span { font-size: 7px; }
.compact-note p { display: -webkit-box; overflow: hidden; margin-top: 3px; font-size: 9px; line-height: 1.35; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.compact-disclaimer { min-height: 0; margin: 0; padding: 7px 8px; font-size: 8px; line-height: 1.35; }
.compact-disclaimer svg { width: 14px; height: 14px; }
.realtime-compact-card .realtime-current-result { margin: 0; padding: 6px 8px; }

html[data-theme="dark"] .market-daily-analysis,
html[data-theme="dark"] .market-analysis-actions button,
html[data-theme="dark"] .realtime-head-actions button { border-color: #34413c; color: #71c2b0; background: #202a27; }
html[data-theme="dark"] .market-analysis-copy p { color: #c5d0cc; }
html[data-theme="dark"] .realtime-risk-summary { border-color: #34413c; background: #34413c; }
html[data-theme="dark"] .realtime-risk-summary span { background: #202725; }
html[data-theme="dark"] .realtime-risk-summary b { color: #edf2f0; }

@media (max-width: 760px) {
  .mobile-nav { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .market-single-screen .gold-market-overview { height: 100%; grid-template-rows: auto minmax(0, 1fr); align-content: stretch; }
  .market-single-screen .market-level-section > header { min-height: 36px; }
  .market-single-screen .market-analysis-actions button { width: 27px; height: 27px; }
  .market-single-screen .market-daily-analysis { flex: 0 0 auto; margin: 5px 9px; padding: 7px 9px; }
  .market-single-screen .market-analysis-copy p { margin-top: 3px; font-size: 9px; line-height: 1.35; -webkit-line-clamp: 3; }
  .market-single-screen .market-analysis-stance { font-size: 9px; }
  .market-single-screen .market-analysis-copy time { font-size: 7px; }
  .market-single-screen .market-level-axis { flex: 0 0 auto; padding: 0 9px 5px; }
  .market-single-screen .market-key-levels { grid-template-rows: 46px 38px 46px; }
  .realtime-compact-page { padding: 7px 9px 8px; }
  .realtime-compact-card { gap: 6px; padding: 9px; }
}

@media (max-height: 700px) and (max-width: 760px) {
  .realtime-compact-page { padding-block: 5px; }
  .realtime-compact-card { gap: 4px; padding: 7px 8px; }
  .realtime-compact-levels > div { min-height: 43px; padding: 5px 7px; }
  .realtime-risk-summary span { padding-block: 4px; }
  .compact-location, .compact-note, .compact-disclaimer { padding-block: 5px; }
  .compact-note p { -webkit-line-clamp: 1; }
}

/* h91: trusted quotes, audit trail, archive recovery and account controls. */
.conversation-scope-tabs { display:grid; grid-template-columns:1fr 1fr; gap:3px; margin:0 14px 9px; padding:3px; border-radius:8px; background:var(--canvas); }
.conversation-scope-tabs button { min-width:0; min-height:31px; display:flex; align-items:center; justify-content:center; gap:6px; color:var(--muted); background:transparent; border:0; border-radius:6px; font-size:10px; }
.conversation-scope-tabs button.active { color:var(--teal); background:var(--surface); box-shadow:0 1px 4px rgba(18,57,49,.08); font-weight:700; }
.conversation-scope-tabs svg { width:13px; height:13px; }
.conversation-scope-tabs b { min-width:16px; height:16px; display:grid; place-items:center; padding:0 4px; border-radius:8px; background:rgba(8,127,114,.1); font-size:8px; }

.pinned-message-banner { width:100%; min-height:42px; padding:7px 14px; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:9px; color:var(--text); background:#edf7f3; border:0; border-bottom:1px solid #d2e7df; text-align:left; }
.pinned-message-banner>svg:first-child { color:var(--teal); }
.pinned-message-banner>span { min-width:0; }
.pinned-message-banner small,.pinned-message-banner strong { display:block; }
.pinned-message-banner small { color:var(--teal); font-size:8px; }
.pinned-message-banner strong { margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:10px; }
.pinned-message-banner>svg:last-child { color:var(--muted); }
.message-row.is-located { animation:pinned-message-locate 1.5s ease; }
@keyframes pinned-message-locate { 0%,100%{background:transparent} 30%,70%{background:rgba(9,135,120,.12)} }

.market-trust-panel { margin-top:6px; border-top:1px solid var(--line); }
.market-trust-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); }
.market-trust-metrics span { min-width:0; padding:6px 7px; border-right:1px solid var(--line); }
.market-trust-metrics span:last-child { border-right:0; }
.market-trust-metrics small,.market-trust-metrics strong { display:block; }
.market-trust-metrics small { color:var(--muted); font-size:7px; }
.market-trust-metrics strong { margin-top:2px; overflow:hidden; text-overflow:ellipsis; color:var(--text); font-size:9px; }
.market-source-health { padding:6px 7px 4px; background:var(--canvas); border-radius:6px; }
.market-source-health header { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.market-source-health header>span { display:flex; align-items:center; gap:5px; color:var(--teal); }
.market-source-health header strong { font-size:8px; }
.market-source-health header small { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--muted); font-size:7px; }
.market-source-health>div { display:flex; gap:5px; margin-top:5px; overflow:hidden; }
.market-source-health>div>span { min-width:0; flex:1; display:grid; grid-template-columns:auto minmax(0,1fr); grid-template-areas:"dot name" "dot meta"; column-gap:4px; padding:3px 4px; background:var(--surface); border:1px solid var(--line); border-radius:5px; }
.market-source-health>div>span>i { grid-area:dot; align-self:center; width:6px; height:6px; border-radius:50%; background:#9aa5a1; }
.market-source-health>div>span>b { grid-area:name; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:7px; }
.market-source-health>div>span>small { grid-area:meta; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--muted); font-size:6px; }
.market-source-health .source-live>i { background:#0e9a7d; }
.market-source-health .source-delayed>i { background:#c49427; }
.market-source-health .source-stale>i,.market-source-health .source-offline>i { background:#d35661; }
.market-source-health .is-primary { border-color:#87c7ba; }

.strategy-system-timeline { padding:6px 7px; background:var(--canvas); border:1px solid var(--line); border-radius:7px; }
.strategy-system-timeline>header { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.strategy-system-timeline>header>span { display:flex; align-items:center; gap:5px; color:var(--teal); }
.strategy-system-timeline>header strong { font-size:8px; }
.strategy-system-timeline>header small { color:var(--muted); font-size:7px; }
.strategy-system-timeline>div { display:flex; align-items:stretch; gap:3px; margin-top:5px; }
.strategy-system-event { position:relative; min-width:0; flex:1; display:flex; flex-direction:column; gap:1px; padding:4px 3px 3px 8px; border-left:2px solid #1a8d7f; }
.strategy-system-event small,.strategy-system-event b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--muted); font-size:6px; font-weight:400; }
.strategy-system-event strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:7px; }
.strategy-system-event>i { position:absolute; left:-4px; top:5px; width:6px; height:6px; border-radius:50%; background:#1a8d7f; }
.strategy-audit-quote { display:flex; align-items:center; gap:6px; margin:7px 0; padding:7px 8px; color:var(--teal); background:var(--canvas); border-radius:6px; }
.strategy-audit-quote span { flex:1; }
.strategy-audit-quote small { color:var(--muted); }

.calendar-market-replay { margin-top:7px; padding:8px; background:var(--surface); border:1px solid var(--line); border-radius:7px; }
.calendar-market-replay header,.calendar-market-replay footer { display:flex; align-items:center; justify-content:space-between; gap:7px; }
.calendar-market-replay header>span { display:flex; align-items:center; gap:5px; color:var(--teal); }
.calendar-market-replay header strong { font-size:9px; }
.calendar-market-replay header small,.calendar-market-replay footer { color:var(--muted); font-size:7px; }
.calendar-market-replay>div { display:grid; grid-template-columns:repeat(3,1fr); gap:5px; margin:7px 0; }
.calendar-market-replay>div span { padding:6px; background:var(--canvas); border-radius:5px; }
.calendar-market-replay>div small,.calendar-market-replay>div strong { display:block; }
.calendar-market-replay>div small { color:var(--muted); font-size:7px; }
.calendar-market-replay>div strong { margin-top:2px; font-size:10px; }
.calendar-market-replay .up strong { color:#cb4b57; }
.calendar-market-replay .down strong { color:#0b8a71; }
.calendar-market-replay footer strong { color:var(--text); }
.calendar-replay-pending { display:flex; align-items:center; gap:6px; margin-top:6px; padding:7px 8px; color:var(--muted); background:var(--canvas); border-radius:6px; font-size:8px; }

.account-data-modal { width:min(92vw,480px); }
.account-data-content { display:grid; gap:9px; padding:4px 2px 8px; }
.account-security-card { padding:11px; background:var(--surface); border:1px solid var(--line); border-radius:8px; }
.account-security-card>header { display:grid; grid-template-columns:34px minmax(0,1fr) auto; gap:9px; align-items:center; }
.account-security-card>header>span { width:34px; height:34px; display:grid; place-items:center; color:var(--teal); background:rgba(8,127,114,.1); border-radius:7px; }
.account-security-card>header strong,.account-security-card>header small { display:block; }
.account-security-card>header strong { font-size:11px; }
.account-security-card>header small { margin-top:2px; color:var(--muted); font-size:8px; }
.account-security-card>header>b { color:var(--muted); font-size:8px; }
.account-security-card>header>b.is-ready { color:var(--teal); }
.account-security-card>button { width:100%; margin-top:9px; }
.recovery-code-value { margin-top:9px; padding:10px; color:var(--teal); background:var(--canvas); border:1px dashed #83bfb4; border-radius:7px; text-align:center; font-family:ui-monospace,Consolas,monospace; font-size:16px; font-weight:700; letter-spacing:1px; }
.account-delete-card { border-color:#edcfd2; }
.auth-recovery-button { width:100%; margin-top:8px; padding:8px; color:var(--teal); background:transparent; border:0; }

.unified-data-state { min-height:180px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px; padding:20px; text-align:center; }
.unified-data-state>span { width:42px; height:42px; display:grid; place-items:center; color:var(--teal); background:rgba(8,127,114,.1); border-radius:9px; }
.unified-data-state>strong { font-size:12px; }
.unified-data-state>small { max-width:280px; color:var(--muted); line-height:1.6; }
.unified-data-state>button { display:flex; align-items:center; gap:5px; margin-top:3px; padding:7px 11px; color:var(--teal); background:var(--surface); border:1px solid #bcd6cf; border-radius:6px; }
.unified-data-state.state-error>span,.unified-data-state.state-offline>span { color:#c44652; background:#fdeff0; }
.unified-data-state.state-delayed>span { color:#a87917; background:#fff2d1; }

html[data-theme="dark"] .pinned-message-banner { background:#183c35; border-color:#285148; }
html[data-theme="dark"] .market-source-health .is-primary { border-color:#337f71; }
html[data-theme="dark"] .account-delete-card { border-color:#6d3940; }

@media (max-width:760px) {
  .market-single-screen .gold-market-overview { grid-template-rows:minmax(205px,.98fr) minmax(0,2.02fr); }
  .market-single-screen .market-quote-board { display:grid; grid-template-rows:auto auto auto auto; align-content:start; }
  .market-single-screen .market-quote-board>footer { margin-top:4px; padding-top:4px; }
  .realtime-compact-card { grid-template-rows:auto auto auto minmax(96px,1.35fr) auto auto minmax(38px,.55fr) auto; gap:5px; }
  .strategy-system-timeline { padding:5px 6px; }
  .account-data-modal { width:calc(100vw - 20px); max-height:calc(var(--app-height) - 24px); }
}

@media (max-height:700px) and (max-width:760px) {
  .market-single-screen .gold-market-overview { grid-template-rows:minmax(180px,.9fr) minmax(0,2.1fr); }
  .market-source-health { display:none; }
  .realtime-compact-card { grid-template-rows:auto auto auto minmax(80px,1.2fr) auto auto minmax(30px,.4fr) auto; gap:3px; padding:7px; }
  .strategy-system-timeline { padding:4px 5px; }
  .strategy-system-event:nth-child(-n+2) { display:none; }
}

/* h86: option A trading-console hierarchy with shared app surfaces. */
.market-key-level-heading {
  display: flex;
  min-height: 28px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 2px;
}
.market-key-level-heading strong { color: var(--ink); font-size: 11px; }
.market-key-level-heading span { display: flex; align-items: center; gap: 4px; color: var(--muted); font-size: 8px; white-space: nowrap; }
.market-key-level-heading i,
.market-level-section > footer i { display: inline-block; width: 8px; height: 3px; border-radius: 2px; }
.market-key-level-heading .tone-resistance { background: var(--danger); }
.market-key-level-heading .tone-pivot { background: var(--warm); }
.market-key-level-heading .tone-support { background: var(--accent); }

.market-key-level,
.market-daily-analysis,
.realtime-card,
.realtime-compact-levels > div,
.realtime-risk-summary span,
.compact-location,
.compact-note { background: var(--surface); }
.market-key-level.tone-pivot { background: color-mix(in srgb, var(--surface) 88%, var(--warm)); }
.market-key-level.is-nearest { background: color-mix(in srgb, var(--surface) 88%, var(--accent)); }
.market-daily-analysis { border-left-color: var(--accent); }
.market-current-zone,
.compact-location { background: color-mix(in srgb, var(--surface) 90%, var(--accent)); }
.realtime-compact-levels .entry { background: color-mix(in srgb, var(--surface) 90%, var(--accent)); }
.realtime-compact-levels .stop { background: color-mix(in srgb, var(--surface) 91%, var(--danger)); }
.realtime-compact-levels .target { background: color-mix(in srgb, var(--surface) 90%, var(--warm)); }
.realtime-compact-levels .exit,
.compact-note,
.realtime-risk-summary span { background: color-mix(in srgb, var(--surface) 94%, var(--canvas)); }

html[data-theme="dark"] .market-key-level,
html[data-theme="dark"] .market-daily-analysis,
html[data-theme="dark"] .realtime-card,
html[data-theme="dark"] .realtime-compact-levels > div,
html[data-theme="dark"] .realtime-risk-summary span,
html[data-theme="dark"] .compact-location,
html[data-theme="dark"] .compact-note { background: var(--surface); }
html[data-theme="dark"] .market-key-level.tone-pivot { background: color-mix(in srgb, var(--surface) 84%, var(--warm)); }
html[data-theme="dark"] .market-key-level.is-nearest,
html[data-theme="dark"] .market-current-zone,
html[data-theme="dark"] .compact-location,
html[data-theme="dark"] .realtime-compact-levels .entry { background: color-mix(in srgb, var(--surface) 84%, var(--accent)); }
html[data-theme="dark"] .realtime-compact-levels .stop { background: color-mix(in srgb, var(--surface) 86%, var(--danger)); }
html[data-theme="dark"] .realtime-compact-levels .target { background: color-mix(in srgb, var(--surface) 86%, var(--warm)); }

@media (max-width: 760px) {
  .market-single-screen .gold-market-overview {
    grid-template-rows: minmax(126px, .78fr) minmax(0, 2.22fr);
    background: var(--canvas);
  }
  .market-single-screen .market-quote-board {
    grid-template-rows: auto minmax(0, 1fr) auto;
    padding: 8px 11px 6px;
    background: var(--surface);
  }
  .market-single-screen .market-quote-summary {
    grid-template-columns: minmax(132px, .88fr) minmax(0, 1.12fr);
    align-items: center;
    gap: 12px;
    margin-top: 6px;
  }
  .market-single-screen .market-quote-primary .market-live-price { font-size: clamp(27px, 8.7vw, 34px); }
  .market-single-screen .market-quote-primary > span { margin-top: 3px; font-size: 9px; }
  .market-single-screen .market-current-zone {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 4px 7px;
    margin-top: 7px;
    padding: 5px 7px;
  }
  .market-single-screen .market-current-zone small,
  .market-single-screen .market-current-zone b,
  .market-single-screen .market-current-zone em { grid-row: auto; grid-column: auto; }
  .market-single-screen .market-current-zone b { font-size: 9px; }
  .market-single-screen .market-current-zone em { justify-self: end; font-size: 9px; }
  .market-single-screen .market-quote-matrix { gap: 6px 9px; }
  .market-single-screen .market-quote-matrix > div { display: grid; grid-template-columns: auto; gap: 1px; }
  .market-single-screen .market-quote-matrix strong { font-size: 11px; text-align: left; }
  .market-single-screen .market-quote-board > footer { margin-top: 5px; padding-top: 4px; }

  .market-single-screen .market-level-section {
    grid-template-rows: auto minmax(66px, .75fr) minmax(0, 2.15fr) auto;
    border-top: 6px solid var(--canvas);
    background: var(--surface);
  }
  .market-single-screen .market-level-section > header { min-height: 39px; padding: 5px 11px; }
  .market-single-screen .market-level-section > header strong { font-size: 13px; }
  .market-single-screen .market-daily-analysis { margin: 5px 10px 6px; padding: 8px 9px; }
  .market-single-screen .market-analysis-copy p { margin-top: 4px; font-size: 9px; line-height: 1.4; }
  .market-single-screen .market-level-axis {
    display: grid;
    height: 100%;
    min-height: 0;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 5px;
    padding: 0 10px 6px;
  }
  .market-single-screen .market-key-level-heading { min-height: 24px; }
  .market-single-screen .market-key-level-heading strong { font-size: 10px; }
  .market-single-screen .market-key-levels {
    grid-template-rows: minmax(45px, 1fr) minmax(40px, .78fr) minmax(45px, 1fr);
    gap: 5px;
  }
  .market-single-screen .market-key-level {
    border-radius: 6px;
    justify-content: center;
    gap: 4px;
    padding: 6px 8px;
  }
  .market-single-screen .market-key-level.tone-pivot {
    grid-template-columns: minmax(0, 1fr) auto;
    padding-inline: 10px;
  }
  .market-single-screen .market-key-level.tone-pivot span { justify-content: flex-start; }
  .market-single-screen .market-key-level.tone-pivot strong { justify-self: end; }

  .app-shell.realtime-open .realtime-pane { background: var(--canvas); }
  .app-shell.realtime-open .realtime-header,
  .app-shell.realtime-open .realtime-tabs,
  .app-shell.realtime-open .realtime-content { background-color: var(--surface); }
  .app-shell.realtime-open .realtime-tabs { border: 1px solid var(--line); }
  .realtime-compact-page { padding: 7px 9px 8px; background: var(--canvas); }
  .realtime-compact-card {
    grid-template-rows: auto auto minmax(104px, 1.55fr) auto auto minmax(45px, .68fr) auto;
    gap: 7px;
    padding: 10px;
    border-radius: 8px;
  }
  .realtime-compact-head h3 { font-size: 17px; }
  .realtime-compact-kicker { font-size: 9px; }
  .realtime-compact-head p { font-size: 9px; }
  .compact-lifecycle { padding: 6px 5px 2px; }
  .compact-lifecycle li i { width: 19px; height: 19px; font-size: 9px; }
  .compact-lifecycle li span { font-size: 8px; }
  .realtime-compact-levels {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: repeat(2, minmax(48px, 1fr));
    gap: 1px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: var(--line);
  }
  .realtime-compact-levels > div {
    min-height: 0;
    justify-content: center;
    padding: 7px 8px;
    border-left-width: 3px;
    border-radius: 0;
  }
  .realtime-compact-levels small { font-size: 8px; }
  .realtime-compact-levels strong { font-size: clamp(12px, 3.6vw, 14px); }
  .compact-location { padding: 8px 9px; }
  .compact-location strong { font-size: 10px; }
  .compact-location span { font-size: 8px; }
  .realtime-risk-summary { border-radius: 7px; }
  .realtime-risk-summary span { padding: 7px 8px; }
  .realtime-risk-summary small { font-size: 8px; }
  .realtime-risk-summary b { font-size: 11px; }
  .compact-note { display: grid; align-content: center; padding: 8px 9px; }
  .compact-note div strong { font-size: 10px; }
  .compact-note p { margin-top: 4px; font-size: 9px; }
  .compact-disclaimer { padding: 7px 9px; }
}

@media (max-height: 700px) and (max-width: 760px) {
  .market-single-screen .gold-market-overview { grid-template-rows: minmax(110px, .7fr) minmax(0, 2.3fr); }
  .market-single-screen .market-quote-board > footer,
  .market-single-screen .market-level-section > header small,
  .market-single-screen .market-level-section > footer small { display: none; }
  .market-single-screen .market-level-section { grid-template-rows: auto minmax(53px, .58fr) minmax(0, 2.2fr) auto; }
  .market-single-screen .market-key-level-heading { min-height: 20px; }
  .market-single-screen .market-key-levels { grid-template-rows: minmax(39px, 1fr) minmax(34px, .72fr) minmax(39px, 1fr); }
  .realtime-compact-card { grid-template-rows: auto auto minmax(88px, 1.45fr) auto auto minmax(34px, .5fr) auto; gap: 4px; padding: 7px 8px; }
  .realtime-compact-levels { grid-template-rows: repeat(2, minmax(41px, 1fr)); }
  .compact-location,
  .realtime-risk-summary span,
  .compact-note,
  .compact-disclaimer { padding-block: 5px; }
}

/* h84: full-viewport market and strategy layouts, compact calendar, and group insight cards. */
.economic-reminder-message,
.gold-news-message {
  width: min(392px, calc(100% - 24px));
  margin: 10px auto;
  overflow: hidden;
  border: 1px solid #ead9ae;
  border-left: 4px solid #bd8c29;
  border-radius: 7px;
  background: #fffdf7;
  box-shadow: 0 8px 20px rgba(77, 64, 31, .08);
}
.economic-reminder-message > header,
.economic-reminder-message > footer,
.gold-news-message > header,
.gold-news-message > footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.economic-reminder-message > header { padding: 10px 12px; color: #fff; background: #9b7223; }
.economic-reminder-message.evening > header { background: #365b68; }
.economic-reminder-message > header span,
.gold-news-message > header span { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 800; }
.economic-reminder-message > header svg,
.gold-news-message > header svg { width: 14px; height: 14px; }
.economic-reminder-message > header time,
.gold-news-message > header time { color: rgba(255,255,255,.76); font-size: 8px; }
.economic-reminder-date { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px 7px; }
.economic-reminder-date strong { font-size: 14px; }
.economic-reminder-date span { color: #8a764a; font-size: 9px; }
.economic-reminder-events { display: grid; gap: 1px; margin: 0 12px 10px; overflow: hidden; border: 1px solid #eee4cc; border-radius: 6px; background: #eee4cc; }
.economic-reminder-events > div { display: grid; grid-template-columns: 46px minmax(0, 1fr); align-items: center; gap: 8px; padding: 8px; background: #fff; }
.economic-reminder-events > div > time { color: #8f681b; font-size: 12px; font-weight: 800; font-variant-numeric: tabular-nums; }
.economic-reminder-events > div > span { display: grid; min-width: 0; gap: 2px; }
.economic-reminder-events strong { overflow: hidden; font-size: 10px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.economic-reminder-events small { color: #9a7d42; font-size: 8px; }
.economic-reminder-message > footer { align-items: flex-start; padding: 9px 12px; border-top: 1px solid #eee4cc; color: #7b6b49; background: #fff9e9; font-size: 8px; line-height: 1.5; }
.economic-reminder-message > footer svg { width: 13px; height: 13px; flex: 0 0 auto; }

.gold-news-message { border-color: #bcded5; border-left-color: #247f70; background: #fff; }
.gold-news-message.tone-negative { border-color: #e8c1c5; border-left-color: #c2535c; }
.gold-news-message > header { padding: 10px 12px; color: #fff; background: #176e62; }
.gold-news-message.tone-negative > header { background: #a8464f; }
.gold-news-tags { display: flex; flex-wrap: wrap; gap: 4px; padding: 9px 12px 0; }
.gold-news-tags span { padding: 2px 6px; border-radius: 4px; color: #176e62; background: #e7f4f0; font-size: 8px; font-weight: 700; }
.gold-news-message.tone-negative .gold-news-tags span { color: #a8464f; background: #faebed; }
.gold-news-message h3 { margin: 8px 12px; color: #25312d; font-size: 13px; line-height: 1.55; }
.gold-news-message > section { margin: 0 12px 8px; padding: 8px 9px; border-radius: 6px; background: #f4f7f6; }
.gold-news-message > section small { display: flex; align-items: center; gap: 4px; color: #71807a; font-size: 8px; }
.gold-news-message > section small svg { width: 11px; height: 11px; }
.gold-news-message > section p { margin: 5px 0 0; color: #4e5c57; font-size: 9px; line-height: 1.55; }
.gold-news-impact { display: grid; gap: 4px; margin: 0 12px 10px; padding: 8px 9px; border-left: 3px solid #2d8b79; background: #eef8f5; }
.gold-news-message.tone-negative .gold-news-impact { border-left-color: #c2535c; background: #fff1f2; }
.gold-news-impact strong { color: #176e62; font-size: 10px; }
.gold-news-message.tone-negative .gold-news-impact strong { color: #a8464f; }
.gold-news-impact span { color: #64716d; font-size: 8px; line-height: 1.5; }
.gold-news-message > footer { padding: 8px 12px; border-top: 1px solid #e6ece9; color: #818b87; font-size: 8px; }
.gold-news-message > footer b { color: #66736e; }

html[data-theme="dark"] .economic-reminder-message { border-color: #66572f; background: #2d291d; }
html[data-theme="dark"] .economic-reminder-events { border-color: #574a2a; background: #574a2a; }
html[data-theme="dark"] .economic-reminder-events > div { background: #292821; }
html[data-theme="dark"] .economic-reminder-message > footer { border-color: #574a2a; color: #d2c294; background: #342f1e; }
html[data-theme="dark"] .gold-news-message { border-color: #315d54; background: #202725; }
html[data-theme="dark"] .gold-news-message.tone-negative { border-color: #6a3940; }
html[data-theme="dark"] .gold-news-message h3 { color: #edf2f0; }
html[data-theme="dark"] .gold-news-message > section { background: #18211e; }
html[data-theme="dark"] .gold-news-message > section p,
html[data-theme="dark"] .gold-news-impact span { color: #b8c6c1; }
html[data-theme="dark"] .gold-news-impact { background: #19342d; }
html[data-theme="dark"] .gold-news-message.tone-negative .gold-news-impact { background: #382126; }

.calendar-list { gap: 7px; padding: 8px 0 16px; }
.calendar-day-group { overflow: hidden; }
.calendar-day-group > header { position: static; min-height: 28px; padding: 5px 10px; background: #f0f3f2; }
.calendar-row { grid-template-areas: "time star countdown" "copy copy copy"; grid-template-columns: 42px 34px minmax(0, 1fr); gap: 5px 7px; padding: 8px 10px; }
.calendar-time { padding-top: 2px; font-size: 10px; }
.calendar-star { width: 34px; height: 21px; font-size: 9px; }
.calendar-countdown { padding-top: 2px; font-size: 8px; }
.calendar-copy { padding-top: 0; }
.calendar-title-line strong { display: -webkit-box; overflow: hidden; font-size: 11px; line-height: 1.4; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.calendar-values { gap: 5px; margin-top: 5px; }
.calendar-value span { font-size: 8px; }
.calendar-value strong { font-size: 10px; }
.calendar-awaiting-impact { margin-top: 5px; font-size: 8px; }
.calendar-awaiting-impact svg { width: 11px; height: 11px; }
.calendar-impact-panel { gap: 4px; margin-top: 6px; padding: 7px 8px; }
.calendar-impact-panel > div span,
.calendar-impact-panel small { font-size: 8px; }
.calendar-impact-panel > div strong { font-size: 10px; }
.calendar-impact-panel p { display: -webkit-box; overflow: hidden; font-size: 9px; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }

@media (max-width: 760px) {
  .app-shell.market-open .jin10-content.market-single-screen { height: 100%; overflow: hidden; }
  .market-single-screen .gold-market-overview { display: grid; height: 100%; min-height: 0; grid-template-rows: minmax(112px, .72fr) minmax(0, 2.28fr); align-content: stretch; overflow: hidden; }
  .market-single-screen .market-quote-board { display: grid; min-height: 0; grid-template-rows: auto minmax(0, 1fr) auto; padding: 7px 12px 5px; }
  .market-single-screen .market-quote-summary { grid-template-columns: minmax(126px, .82fr) minmax(0, 1.18fr); gap: 12px; margin-top: 5px; }
  .market-single-screen .market-quote-primary .market-live-price { font-size: clamp(25px, 8.2vw, 32px); }
  .market-single-screen .market-current-zone { margin-top: 5px; padding: 5px 7px; }
  .market-single-screen .market-quote-matrix strong { font-size: 11px; }
  .market-single-screen .market-quote-board > footer { display: flex; margin-top: 4px; }
  .market-single-screen .market-level-section { display: grid; min-height: 0; grid-template-rows: auto minmax(62px, .7fr) minmax(0, 2fr) auto; margin-top: 0; overflow: hidden; }
  .market-single-screen .market-level-section > header { min-height: 38px; padding: 4px 11px; }
  .market-single-screen .market-level-section > header strong { font-size: 12px; }
  .market-single-screen .market-level-section > header small { display: block; font-size: 8px; }
  .market-single-screen .market-analysis-actions button { width: 29px; height: 29px; }
  .market-single-screen .market-daily-analysis { height: calc(100% - 10px); min-height: 0; margin: 5px 10px; padding: 7px 9px; }
  .market-single-screen .market-analysis-copy { display: grid; height: 100%; grid-template-rows: auto minmax(0, 1fr); }
  .market-single-screen .market-analysis-copy p { margin-top: 4px; font-size: 10px; line-height: 1.4; -webkit-line-clamp: 3; }
  .market-single-screen .market-level-axis { display: block; height: 100%; min-height: 0; padding: 0 10px 5px; }
  .market-single-screen .market-key-levels { display: grid; height: 100%; min-height: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: minmax(45px, 1fr) minmax(38px, .72fr) minmax(45px, 1fr); gap: 5px; }
  .market-single-screen .market-key-level { min-height: 0; justify-content: center; gap: 4px; padding: 6px 8px; }
  .market-single-screen .market-key-level span { font-size: 10px; }
  .market-single-screen .market-key-level span small { font-size: 8px; }
  .market-single-screen .market-key-level strong { font-size: clamp(12px, 3.6vw, 15px); }
  .market-single-screen .market-key-level.tone-pivot strong { font-size: clamp(15px, 4.5vw, 18px); }
  .market-single-screen .market-level-section > footer { min-height: 27px; padding: 4px 10px; font-size: 8px; }
  .market-single-screen .market-level-section > footer small { display: block; max-width: 120px; font-size: 7px; }

  .app-shell.realtime-open .realtime-header { min-height: 58px; padding: 7px 10px; gap: 7px; }
  .app-shell.realtime-open .realtime-mark { width: 38px; height: 38px; }
  .app-shell.realtime-open .realtime-heading h2 { font-size: 15px; }
  .app-shell.realtime-open .realtime-heading p { font-size: 9px; }
  .app-shell.realtime-open .realtime-header .icon-button { width: 34px; height: 34px; }
  .app-shell.realtime-open .realtime-live-strip { min-height: 34px; padding: 0 12px; font-size: 9px; }
  .app-shell.realtime-open .realtime-live-strip small { font-size: 8px; }
  .app-shell.realtime-open .realtime-tabs { min-height: 39px; margin: 5px 10px 0; padding: 3px; }
  .app-shell.realtime-open .realtime-tabs button { min-height: 31px; }
  .realtime-compact-page { height: 100%; padding: 6px 9px 7px; }
  .realtime-compact-card { height: 100%; grid-template-rows: auto auto minmax(92px, 1.5fr) auto auto minmax(40px, .75fr) auto; align-content: stretch; gap: 6px; padding: 9px; }
  .realtime-compact-levels { height: 100%; grid-template-rows: repeat(2, minmax(42px, 1fr)); }
  .realtime-compact-levels > div { min-height: 0; justify-content: center; padding: 6px 8px; }
  .realtime-compact-levels strong { font-size: clamp(12px, 3.5vw, 14px); }
  .compact-note { display: grid; align-content: center; }
  .compact-note p { -webkit-line-clamp: 2; }

  .app-shell.market-open .calendar-toolbar { min-height: 46px; padding: 6px 10px; }
  .app-shell.market-open .calendar-toolbar > span { font-size: 9px; }
  .app-shell.market-open .week-switch { width: 112px; }
  .app-shell.market-open .week-switch button { height: 27px; font-size: 10px; }
  .app-shell.market-open .calendar-star-filter button { padding: 5px 7px; font-size: 9px; }
  .app-shell.market-open .jin10-content:not(.market-single-screen) { padding: 0 10px 18px; }
}

@media (max-height: 700px) and (max-width: 760px) {
  .market-single-screen .gold-market-overview { grid-template-rows: minmax(100px, .66fr) minmax(0, 2.34fr); }
  .market-single-screen .market-quote-board > footer,
  .market-single-screen .market-level-section > header small,
  .market-single-screen .market-level-section > footer small { display: none; }
  .market-single-screen .market-level-section { grid-template-rows: auto minmax(50px, .56fr) minmax(0, 2.1fr) auto; }
  .market-single-screen .market-analysis-copy p { font-size: 9px; -webkit-line-clamp: 2; }
  .market-single-screen .market-key-levels { grid-template-rows: minmax(39px, 1fr) minmax(34px, .72fr) minmax(39px, 1fr); }
  .realtime-compact-card { grid-template-rows: auto auto minmax(82px, 1.4fr) auto auto minmax(34px, .55fr) auto; gap: 4px; padding: 7px 8px; }
  .app-shell.realtime-open .realtime-header { min-height: 52px; padding-block: 5px; }
  .app-shell.realtime-open .realtime-live-strip { min-height: 30px; }
  .app-shell.realtime-open .realtime-tabs { min-height: 35px; margin-top: 3px; }
  .app-shell.realtime-open .realtime-tabs button { min-height: 27px; }
  .compact-note p { -webkit-line-clamp: 1; }
}

/* h86 authoritative viewport values. */
@media (max-width: 760px) {
  .market-single-screen .gold-market-overview { grid-template-rows: minmax(126px, .78fr) minmax(0, 2.22fr); background: var(--canvas); }
  .market-single-screen .market-quote-board { padding: 8px 11px 6px; background: var(--surface); }
  .market-single-screen .market-quote-summary { grid-template-columns: minmax(132px, .88fr) minmax(0, 1.12fr); gap: 12px; margin-top: 6px; }
  .market-single-screen .market-quote-primary .market-live-price { font-size: clamp(27px, 8.7vw, 34px); }
  .market-single-screen .market-current-zone { grid-template-columns: auto minmax(0, 1fr) auto; gap: 4px 7px; margin-top: 7px; padding: 5px 7px; }
  .market-single-screen .market-current-zone small,
  .market-single-screen .market-current-zone b,
  .market-single-screen .market-current-zone em { grid-row: auto; grid-column: auto; }
  .market-single-screen .market-current-zone em { justify-self: end; }
  .market-single-screen .market-quote-matrix > div { grid-template-columns: auto; gap: 1px; }
  .market-single-screen .market-quote-matrix strong { text-align: left; }
  .market-single-screen .market-level-section { grid-template-rows: auto minmax(66px, .75fr) minmax(0, 2.15fr) auto; border-top: 6px solid var(--canvas); background: var(--surface); }
  .market-single-screen .market-level-section > header { min-height: 39px; padding: 5px 11px; }
  .market-single-screen .market-daily-analysis { margin: 5px 10px 6px; padding: 8px 9px; }
  .market-single-screen .market-level-axis { display: grid; height: 100%; grid-template-rows: auto minmax(0, 1fr); gap: 5px; padding: 0 10px 6px; }
  .market-single-screen .market-key-level-heading { min-height: 24px; }
  .market-single-screen .market-key-levels { grid-template-rows: minmax(45px, 1fr) minmax(40px, .78fr) minmax(45px, 1fr); }
  .market-single-screen .market-key-level.tone-pivot { grid-template-columns: minmax(0, 1fr) auto; }
  .market-single-screen .market-key-level.tone-pivot span { justify-content: flex-start; }
  .market-single-screen .market-key-level.tone-pivot strong { justify-self: end; }
  .app-shell.realtime-open .realtime-pane,
  .realtime-compact-page { background: var(--canvas); }
  .app-shell.realtime-open .realtime-header,
  .app-shell.realtime-open .realtime-tabs,
  .app-shell.realtime-open .realtime-content { background-color: var(--surface); }
  .realtime-compact-card { grid-template-rows: auto auto minmax(104px, 1.55fr) auto auto minmax(45px, .68fr) auto; gap: 7px; padding: 10px; }
  .realtime-compact-levels { grid-template-rows: repeat(2, minmax(48px, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: var(--line); }
  .realtime-compact-levels > div { border-radius: 0; }
}

@media (max-height: 700px) and (max-width: 760px) {
  .market-single-screen .gold-market-overview { grid-template-rows: minmax(110px, .7fr) minmax(0, 2.3fr); }
  .market-single-screen .market-level-section { grid-template-rows: auto minmax(53px, .58fr) minmax(0, 2.2fr) auto; }
  .market-single-screen .market-key-level-heading { min-height: 20px; }
  .realtime-compact-card { grid-template-rows: auto auto minmax(88px, 1.45fr) auto auto minmax(34px, .5fr) auto; }
  .realtime-compact-levels { grid-template-rows: repeat(2, minmax(41px, 1fr)); }
}

/* h91 final cascade: quote trust and strategy audit remain visible in one phone viewport. */
@media (max-width: 760px) {
  .market-single-screen .gold-market-overview {
    grid-template-rows: minmax(205px, .98fr) minmax(0, 2.02fr);
  }
  .market-single-screen .market-quote-board {
    grid-template-rows: auto auto auto auto;
    align-content: start;
  }
  .market-single-screen .market-quote-board > footer {
    margin-top: 4px;
    padding-top: 4px;
  }
  .realtime-compact-card {
    grid-template-rows: auto auto auto minmax(96px, 1.35fr) auto auto minmax(38px, .55fr) auto;
    gap: 5px;
  }
}

@media (max-height: 700px) and (max-width: 760px) {
  .market-single-screen .gold-market-overview {
    grid-template-rows: minmax(180px, .9fr) minmax(0, 2.1fr);
  }
  .market-source-health { display: none; }
  .realtime-compact-card {
    grid-template-rows: auto auto auto minmax(80px, 1.2fr) auto auto minmax(30px, .4fr) auto;
    gap: 3px;
    padding: 7px;
  }
  .strategy-system-timeline { padding: 4px 5px; }
  .strategy-system-event:nth-child(-n+2) { display: none; }
}

/* h92 final cascade: the removed quote-trust block no longer reserves vertical space. */
@media (max-width: 760px) {
  .market-single-screen .gold-market-overview { grid-template-rows: minmax(126px, .78fr) minmax(0, 2.22fr); }
  .market-single-screen .market-quote-board { grid-template-rows: auto minmax(0, 1fr) auto; align-content: stretch; }
}

@media (max-height: 700px) and (max-width: 760px) {
  .market-single-screen .gold-market-overview { grid-template-rows: minmax(110px, .7fr) minmax(0, 2.3fr); }
}