:root {
  color-scheme: dark;
  --bg: #080d13;
  --surface: #0f1721;
  --surface-2: #131d29;
  --line: #263545;
  --line-soft: #1d2a37;
  --text: #eef4fa;
  --muted: #8294a8;
  --red: #ff555d;
  --green: #31d7a0;
  --amber: #ffbc55;
  --blue: #70a8e8;
}

* { box-sizing: border-box; }

html,
body {
  min-width: 1180px;
  min-height: 100%;
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: "Microsoft YaHei UI", "Microsoft YaHei", Arial, sans-serif;
  font-size: 15px;
  letter-spacing: 0;
}

button,
a { font: inherit; }

button { cursor: pointer; }

.topbar {
  height: 68px;
  display: flex;
  align-items: center;
  gap: 26px;
  padding: 0 22px;
  border-bottom: 1px solid var(--line);
  background: #0b121b;
}

.brand {
  min-width: 235px;
  display: flex;
  align-items: center;
  gap: 11px;
  color: var(--text);
  text-decoration: none;
}

.brand-mark {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 1px solid #8f343b;
  border-radius: 6px;
  background: #29171d;
  color: var(--red);
  font-size: 22px;
  font-weight: 900;
}

.brand strong { display: block; font-size: 21px; line-height: 1.15; }
.brand small { display: block; margin-top: 3px; color: var(--muted); font-size: 12px; }

.topnav {
  height: 100%;
  display: flex;
  align-items: center;
  gap: 5px;
}

.topnav a {
  height: 40px;
  display: inline-flex;
  align-items: center;
  padding: 0 14px;
  border: 1px solid transparent;
  border-radius: 5px;
  color: #9fb0c2;
  font-weight: 700;
  text-decoration: none;
}

.topnav a:hover { color: #fff; }
.topnav a.active { border-color: #8f343b; background: #3a2027; color: #fff; }

.topbar-note {
  margin-left: auto;
  color: #9cafc1;
  font-size: 13px;
}

.qmt-manage-link {
  display: block;
  margin-top: 12px;
  color: var(--blue);
  font-size: 13px;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
}

.qmt-manage-link:hover { color: #9bc5f3; text-decoration: underline; }

.page {
  width: 100%;
  padding: 20px 22px 36px;
}

.page-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  padding-bottom: 17px;
  border-bottom: 1px solid var(--line);
}

.eyebrow {
  color: var(--amber);
  font-size: 12px;
  font-weight: 800;
}

.page-head h1 {
  margin: 5px 0 0;
  font-size: 27px;
}

.page-head p {
  max-width: 760px;
  margin: 7px 0 0;
  color: var(--muted);
  line-height: 1.6;
}

.strategy-notification-note {
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 14px;
  padding: 10px 12px;
  border: 1px solid rgba(77, 151, 204, .45);
  border-radius: 7px;
  color: #c8d9e8;
  background: rgba(23, 51, 73, .68);
  font-size: 13px;
  line-height: 1.55;
}

.strategy-notification-note strong { color: #fff; }
.strategy-notification-note span { flex: 1 1 auto; }
.strategy-notification-note a {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  padding: 0 12px;
  border: 1px solid #4f86ad;
  border-radius: 5px;
  color: #d8efff;
  text-decoration: none;
  font-weight: 700;
}

.strategy-notification-note a:focus-visible { outline: 3px solid #8fd0ff; outline-offset: 2px; }

.tier-tabs,
.year-tabs {
  display: flex;
  gap: 6px;
}

.tier-tabs button,
.year-tabs button,
.back-link,
.secondary-btn,
.primary-btn {
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: #111b27;
  color: #c5d1dd;
  font-weight: 700;
  text-decoration: none;
}

.tier-tabs button.active,
.year-tabs button.active {
  border-color: #8f343b;
  background: #3a2027;
  color: #fff;
}

.strategy-sortbar {
  min-height: 52px;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  padding: 8px 12px;
  border: 1px solid var(--line);
  background: var(--surface);
}

.strategy-sortbar[hidden] { display: none; }

.strategy-sortbar strong {
  margin-right: 4px;
  color: var(--text);
  font-size: 14px;
}

.strategy-sortbar button {
  height: 34px;
  min-width: 78px;
  padding: 0 13px;
  border: 1px solid #38506a;
  border-radius: 4px;
  background: #132131;
  color: #b9c9d8;
  font-weight: 700;
}

.strategy-sortbar button:hover { border-color: #607b96; color: #fff; }
.strategy-sortbar button.active { border-color: #a23b44; background: #4a2027; color: #fff; }
.strategy-sortbar span { margin-left: auto; color: var(--muted); font-size: 12px; }

.strategy-board-filter {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-left: 14px;
  padding-left: 14px;
  border-left: 1px solid var(--line);
}

.strategy-board-filter strong {
  color: #aebed0;
  font-size: 13px;
}

.strategy-board-filter button[data-board-filter="tech"].active {
  border-color: #b68124;
  background: #4a3612;
  color: #ffe09a;
}

@media (max-width: 767px) {
  .strategy-board-filter {
    width: 100%;
    margin: 6px 0 0;
    padding: 9px 0 0;
    border-top: 1px solid var(--line-soft);
    border-left: 0;
  }
}

.primary-btn {
  border-color: #9a3942;
  background: #512229;
  color: #fff;
}

.primary-btn:hover { background: #642830; }
.secondary-btn:hover,
.back-link:hover { border-color: #4b6075; color: #fff; }

.strategy-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(330px, 1fr));
  gap: 14px;
  margin-top: 18px;
}

.strategy-card {
  min-height: 292px;
  display: grid;
  grid-template-rows: auto auto auto 1fr auto auto;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
  overflow: hidden;
}

.strategy-card:hover {
  border-color: #465d73;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .25);
}

.strategy-card.vip { border-top: 3px solid #9b7836; }
.strategy-card.free { border-top: 3px solid #96404a; }

.strategy-card-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 17px 12px;
}

.strategy-card-head > span:first-child {
  min-width: 44px;
  height: 32px;
  display: grid;
  place-items: center;
  border: 1px solid #7e622e;
  border-radius: 4px;
  background: #2c2416;
  color: var(--amber);
  font-size: 12px;
  font-weight: 900;
}

.strategy-card.free .strategy-card-head > span:first-child {
  border-color: #873842;
  background: #321c22;
  color: #ff737b;
}

.strategy-card h2 { margin: 0; font-size: 20px; }
.strategy-card h2 small { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; font-weight: 500; }

.status-chip {
  margin-left: auto;
  padding: 4px 7px;
  border: 1px solid #2e725f;
  border-radius: 4px;
  background: #153229;
  color: var(--green);
  font-size: 12px;
  font-weight: 800;
}

.strategy-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 0 17px 12px;
}

.strategy-tags span {
  padding: 4px 7px;
  border: 1px solid #304357;
  border-radius: 4px;
  color: #9eb1c4;
  font-size: 12px;
}

.strategy-summary {
  min-height: 52px;
  margin: 0;
  padding: 0 17px 13px;
  color: #a9b8c7;
  font-size: 13px;
  line-height: 1.6;
}

.metric-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--line-soft);
  border-bottom: 1px solid var(--line-soft);
}

.metric-grid > div {
  min-width: 0;
  padding: 10px 12px;
  border-right: 1px solid var(--line-soft);
  border-bottom: 1px solid var(--line-soft);
}

.metric-grid > div:nth-child(3n) { border-right: 0; }
.metric-grid > div:nth-last-child(-n+3) { border-bottom: 0; }
.metric-grid span { display: block; color: var(--muted); font-size: 11px; }
.metric-grid strong { display: block; margin-top: 4px; font-size: 16px; font-variant-numeric: tabular-nums; }

.backtest-disclosure {
  margin: 0;
  padding: 9px 14px;
  border-bottom: 1px solid var(--line-soft);
  background: #0c151f;
  color: #8295a8;
  font-size: 11px;
  line-height: 1.55;
}

.card-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  padding: 13px 16px;
}

.strategy-read-btn {
  margin-right: 0;
  border-color: #426a87;
  background: #173047;
  color: #d9efff;
}

.strategy-notification-btn {
  margin-right: auto;
  border-color: #4f718d;
  color: #d8ebfb;
}

.strategy-notification-btn.is-active {
  border-color: rgba(56, 201, 151, .72);
  background: rgba(29, 127, 96, .24);
  color: #75e4b9;
}

.qmt-card-btn {
  border-color: #287f77;
  background: #17443f;
  color: #ddfffb;
}

.qmt-card-btn:hover { background: #1d5952; }
.qmt-card-btn.is-added { border-color: #3d6270; background: #17313a; color: #9bdad0; }
.qmt-card-btn.is-added:hover { background: #1c3c46; }

.strategy-read-btn:hover {
  border-color: #68a9d3;
  background: #20415d;
}

.empty-library {
  margin-top: 18px;
  padding: 52px 20px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
  color: var(--muted);
  text-align: center;
}

.detail-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 15px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}

.detail-title h1 { margin: 0; font-size: 25px; }
.detail-title p { margin: 6px 0 0; color: var(--muted); font-size: 13px; }
.detail-actions { display: flex; align-items: center; gap: 8px; }

.hero-metrics {
  display: grid;
  grid-template-columns: repeat(6, minmax(130px, 1fr));
  margin-top: 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  overflow: hidden;
}

.hero-metrics > div {
  min-width: 0;
  padding: 13px 15px;
  border-right: 1px solid var(--line);
}

.hero-metrics > div:last-child { border-right: 0; }
.hero-metrics span { display: block; color: var(--muted); font-size: 12px; }
.hero-metrics strong { display: block; margin-top: 5px; font-size: 20px; font-variant-numeric: tabular-nums; }

.positive { color: var(--red) !important; }
.negative { color: var(--green) !important; }
.neutral { color: #dfe8f1 !important; }

.chart-card,
.trade-card {
  margin-top: 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  overflow: hidden;
}

.section-head {
  min-height: 52px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 15px;
  border-bottom: 1px solid var(--line);
}

.section-head h2 { margin: 0; font-size: 17px; }
.section-head span { color: var(--muted); font-size: 12px; }

.chart {
  width: 100%;
  height: 360px;
}

.trade-scroll {
  max-height: 570px;
  overflow: auto;
  background: #f7f9fc;
  scrollbar-color: #8d9bae #e8edf3;
  scrollbar-width: thin;
}

.trade-table {
  width: max-content;
  min-width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: auto;
  color: #142234;
  font-size: 14px;
  line-height: 1.2;
}

.trade-table th,
.trade-table td {
  width: auto;
  min-width: max-content;
  padding: 9px 11px;
  border-right: 1px solid #d5dde8;
  border-bottom: 1px solid #d5dde8;
  text-align: center;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.trade-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  padding-top: 10px;
  padding-bottom: 10px;
  background: #edf2f8;
  color: #142234;
  font-weight: 800;
}

.trade-table th:last-child,
.trade-table td:last-child { border-right: 0; }

.trade-table tbody tr { transition: background .12s ease, box-shadow .12s ease; }
.trade-table tbody tr:nth-child(even) { background: #f0f5fb; }
.trade-table tbody tr:hover { background: #dfeafb; box-shadow: inset 3px 0 #557fc5; }
.trade-table td.name-cell { font-weight: 800; }
.trade-table td.rank-cell { color: #155df2; font-weight: 800; }
.trade-table td.pnl-positive { color: #e23b17; font-weight: 800; }
.trade-table td.pnl-negative { color: #008865; font-weight: 800; }

.loading,
.error-state {
  padding: 72px 20px;
  color: var(--muted);
  text-align: center;
}

.error-state { color: #ff8c93; }

.notice-dialog {
  width: min(680px, calc(100vw - 32px));
  padding: 0;
  border: 1px solid #5a3a41;
  border-radius: 7px;
  background: #111a24;
  color: var(--text);
}

.notice-dialog::backdrop { background: rgba(3, 7, 12, .72); }
.notice-dialog h2 { margin: 0; padding: 18px 18px 8px; font-size: 19px; }
.notice-message {
  max-height: calc(100vh - 190px);
  overflow-y: auto;
  padding: 0 18px 18px;
  color: #aab9c8;
  font-size: 14px;
  line-height: 1.65;
}

.notice-message > p { margin: 0; }

.strategy-interpretation .plain-summary {
  margin: 4px 0 14px;
  padding: 11px 12px;
  border-left: 3px solid #d2933d;
  background: #18232f;
  color: #edf4fb;
  font-size: 15px;
  font-weight: 800;
}

.strategy-interpretation h3 {
  margin: 14px 0 5px;
  color: #dfe9f3;
  font-size: 13px;
}

.strategy-interpretation ul {
  margin: 0;
  padding-left: 20px;
}

.strategy-interpretation li + li { margin-top: 5px; }

.strategy-interpretation .interpretation-note {
  margin: 7px 0 0;
  color: #c3d0dd;
}

.strategy-interpretation .risk-note {
  color: #f0c58b;
}

.strategy-interpretation .avoid-note {
  color: #f2a4a8;
}

.notice-dialog footer { display: flex; justify-content: flex-end; padding: 12px 18px; border-top: 1px solid var(--line); }

.qmt-dialog {
  width: min(660px, calc(100vw - 32px));
  min-height: 540px;
  border-color: #3e556a;
  background: #0d1b29;
}
.qmt-dialog-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 18px 18px 10px;
  border-bottom: 1px solid var(--line);
}
.qmt-dialog-head h2 { padding: 2px 0 0; font-size: 24px; letter-spacing: -.02em; }
.qmt-close-btn {
  width: 36px;
  height: 36px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #162330;
  color: #c5d1dd;
  font-size: 23px;
}
.qmt-dialog-body { min-height: 430px; max-height: calc(100vh - 128px); overflow-y: auto; padding: 18px; }
.qmt-route {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin: 0 0 24px;
  padding: 0 30px;
  list-style: none;
}
.qmt-route li { position: relative; display: flex; align-items: center; gap: 9px; color: #8094a7; font-weight: 700; }
.qmt-route li::after { content: ""; position: absolute; z-index: 0; top: 16px; left: 42px; width: calc(100% - 48px); height: 2px; background: #3a4c5e; }
.qmt-route li:last-child::after { display: none; }
.qmt-route b { position: relative; z-index: 1; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: #34465a; color: #dce6ef; }
.qmt-route span { position: relative; z-index: 1; padding-right: 10px; background: #0d1b29; }
.qmt-route .is-active { color: #edf8f7; }
.qmt-route .is-active b { background: #15a9a0; color: #fff; box-shadow: 0 0 18px rgba(21, 169, 160, .24); }
.qmt-route .is-complete b { background: #26756f; color: #fff; }
.qmt-route .is-complete::after { background: #19bdb2; }
.qmt-create-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(230px, .85fr); gap: 28px; align-items: stretch; min-height: 220px; padding: 24px 2px 26px; border-top: 1px solid #26384a; }
.qmt-security { display: grid; align-content: center; gap: 18px; padding-left: 25px; border-left: 1px solid #34495d; }
.qmt-security p { display: grid; grid-template-columns: 26px 1fr; gap: 10px; align-items: start; margin: 0; color: #b8c8d6; line-height: 1.55; }
.qmt-security i { display: grid; place-items: center; width: 24px; height: 24px; border: 1px solid #54748e; border-radius: 50%; color: #9eb8ce; font-style: normal; }
.qmt-status { margin: 0 0 14px; padding: 10px 12px; border: 1px solid #36516b; border-radius: 6px; background: #132232; color: #c7d9e8; }
.qmt-status[hidden] { display: none; }
.qmt-status[data-tone="success"] { border-color: #347d68; background: #14352e; color: #8ee8c7; }
.qmt-status[data-tone="warning"] { border-color: #806238; background: #342814; color: #f0cb8f; }
.qmt-status[data-tone="error"] { border-color: #8c3f47; background: #35191d; color: #ffadb2; }
.qmt-field { display: grid; gap: 7px; margin: 0 0 14px; color: #d8e4ef; font-weight: 700; }
.qmt-field input,
.qmt-field select,
.qmt-code {
  width: 100%;
  border: 1px solid #344b61;
  border-radius: 6px;
  background: #0a141f;
  color: #edf5fc;
  box-sizing: border-box;
}
.qmt-field input,
.qmt-field select { height: 43px; padding: 0 11px; }
.qmt-field small { color: #8094a7; font-weight: 400; line-height: 1.5; }
.qmt-wide-btn { width: 100%; }
.qmt-dialog .primary-btn { border-color: #199a92; background: #168f88; color: #fff; }
.qmt-dialog .primary-btn:hover { background: #1ba79e; }
.qmt-steps { display: grid; gap: 10px; margin: 0 0 15px; padding-left: 22px; color: #90a5b8; }
.qmt-steps li { padding-left: 4px; }
.qmt-steps strong { display: block; color: #e5eef6; }
.qmt-steps span { display: block; margin-top: 3px; line-height: 1.5; }
.qmt-pair-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.qmt-pair-grid > div,
.qmt-device-summary { padding: 12px; border: 1px solid #33495e; border-radius: 6px; background: #0c1722; }
.qmt-pair-grid span,
.qmt-device-summary span,
.qmt-device-summary small { display: block; color: #8196aa; }
.qmt-pair-grid code,
.qmt-device-summary strong { display: block; margin-top: 5px; color: #eff7ff; word-break: break-all; }
.qmt-expiry { color: #d8aa68; font-size: 12px; }
.qmt-code { min-height: 190px; padding: 11px; resize: vertical; font: 12px/1.5 Consolas, monospace; }
.qmt-action-row { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0; }
.qmt-device-summary { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 12px; margin-bottom: 14px; }
.qmt-device-summary > i { width: 34px; height: 30px; display: grid; place-items: center; border: 2px solid #9eb2c4; border-radius: 4px; color: #9eb2c4; font-style: normal; }
.qmt-device-summary small { margin-top: 0; padding-left: 16px; color: #71cdb6; white-space: nowrap; }
.qmt-inline-control { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, .9fr); align-items: center; gap: 14px; }
.qmt-inline-control small { color: #8096aa; font-weight: 400; }
.qmt-switch { display: flex; align-items: center; gap: 9px; margin: 16px 0; color: #eef6fd; font-weight: 800; }
.qmt-switch > span { margin-right: auto; }
.qmt-switch input { position: absolute; opacity: 0; pointer-events: none; }
.qmt-switch i { position: relative; width: 44px; height: 24px; border-radius: 999px; background: #3b4d5d; transition: .18s ease; }
.qmt-switch i::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #d7e2ea; transition: .18s ease; }
.qmt-switch input:checked + i { background: #16a89f; box-shadow: 0 0 16px rgba(22,168,159,.2); }
.qmt-switch input:checked + i::after { left: 23px; background: #fff; }
.qmt-risk { padding: 11px 12px; border-left: 3px solid #a66c2a; background: #2b2115; color: #e4c18f; line-height: 1.6; }

.mobile-strategy-header,
.mobile-strategy-status,
.mobile-only-action,
.mobile-disclosure,
#mobileBottomNav {
  display: none;
}

@media (max-width: 1500px) {
  .topbar { gap: 12px; padding: 0 14px; }
  .topnav a { padding: 0 10px; font-size: 14px; }
  .page { padding-right: 14px; padding-left: 14px; }
  .strategy-grid { grid-template-columns: repeat(2, minmax(360px, 1fr)); }
  .hero-metrics > div { padding-right: 10px; padding-left: 10px; }
}

@media (max-width: 767px) {
  html,
  body {
    min-width: 0;
    width: 100%;
    overflow-x: clip;
  }

  body {
    padding-bottom: calc(82px + env(safe-area-inset-bottom));
  }

  .topbar {
    display: none;
  }

  .page {
    width: 100%;
    padding: 0 10px 34px;
  }

  .mobile-strategy-header {
    min-height: 92px;
    display: grid;
    grid-template-columns: minmax(92px, 1fr) auto minmax(92px, 1fr);
    align-items: center;
    gap: 8px;
    margin: 0 -2px;
    padding: 14px 0 8px;
  }

  .mobile-strategy-header h1 {
    margin: 0;
    color: #fff;
    font-size: 24px;
    font-weight: 800;
    letter-spacing: .04em;
    text-align: center;
    white-space: nowrap;
  }

  .mobile-strategy-back,
  .mobile-strategy-import-note {
    min-width: 0;
    min-height: 44px;
    display: flex;
    align-items: center;
    gap: 5px;
    color: var(--mf-mobile-muted);
    text-decoration: none;
  }

  .mobile-strategy-back {
    justify-self: start;
    font-size: 14px;
    white-space: nowrap;
  }

  .mobile-strategy-import-note {
    justify-self: end;
    justify-content: flex-end;
    max-width: 112px;
    font-size: 11px;
    line-height: 1.35;
    text-align: right;
  }

  .mobile-strategy-back svg,
  .mobile-strategy-import-note svg,
  .mobile-only-action svg {
    width: 22px;
    height: 22px;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .page-head {
    display: block;
    padding: 0;
    border-bottom: 1px solid rgba(33, 54, 76, .72);
  }

  .page-head > div:first-child {
    display: none;
  }

  .strategy-notification-note {
    align-items: flex-start;
    flex-wrap: wrap;
    margin: 10px 12px 0;
    border-radius: 10px;
  }

  .strategy-notification-note span { flex-basis: calc(100% - 74px); }
  .strategy-notification-note a { width: 100%; justify-content: center; }

  .tier-tabs {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
  }

  .tier-tabs button {
    position: relative;
    height: 60px;
    border: 0;
    border-radius: 0;
    color: var(--mf-mobile-muted);
    background: transparent;
    font-size: 18px;
    font-weight: 750;
  }

  .tier-tabs button.active {
    border: 0;
    color: var(--mf-mobile-text);
    background: transparent;
  }

  .tier-tabs button.active::after {
    content: "";
    position: absolute;
    left: 27%;
    right: 27%;
    bottom: 0;
    height: 3px;
    border-radius: 3px 3px 0 0;
    background: var(--mf-mobile-primary);
  }

  .mobile-strategy-status:not([hidden]) {
    min-height: 52px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 10px 0;
    border: 1px solid var(--mf-mobile-border);
    border-radius: 10px;
    color: var(--mf-mobile-muted);
    background: rgba(9, 25, 39, .72);
    padding: 0 12px;
    font-size: 12px;
  }

  .mobile-strategy-status span {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
  }

  .mobile-strategy-status i {
    width: 8px;
    height: 8px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: var(--mf-mobile-primary);
    box-shadow: 0 0 10px rgba(54, 215, 192, .4);
  }

  .mobile-strategy-status strong {
    overflow: hidden;
    color: var(--mf-mobile-muted);
    font-size: 12px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-strategy-status time {
    font: 500 11px/1.2 var(--mf-mobile-number);
    white-space: nowrap;
  }

  .mobile-strategy-status[data-state="stale"] i,
  .mobile-strategy-status[data-state="unavailable"] i {
    background: var(--mf-mobile-amber);
    box-shadow: 0 0 10px rgba(255, 176, 32, .32);
  }

  .strategy-sortbar {
    min-height: 48px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr)) 76px;
    gap: 7px;
    margin: 0;
    border: 0;
    background: transparent;
    padding: 0 0 10px;
  }

  .strategy-sortbar[hidden] {
    display: none;
  }

  .strategy-sortbar > strong {
    display: none;
  }

  .strategy-sortbar button {
    width: 100%;
    min-width: 0;
    height: 42px;
    border-color: var(--mf-mobile-border);
    border-radius: 8px;
    color: var(--mf-mobile-muted);
    background: rgba(9, 23, 36, .8);
    padding: 0 4px;
    font-size: 12px;
  }

  .strategy-sortbar button:hover {
    border-color: var(--mf-mobile-border);
  }

  .strategy-sortbar button.active {
    border-color: var(--mf-mobile-primary);
    color: var(--mf-mobile-primary);
    background: var(--mf-mobile-primary-soft);
  }

  .strategy-sortbar > span {
    margin-left: 0;
    align-self: center;
    color: var(--mf-mobile-muted-2);
    font-size: 0;
    line-height: 1.35;
    text-align: right;
  }

  .strategy-sortbar > span::after {
    content: "仅调整卡片顺序  ⓘ";
    font-size: 10px;
  }

  .strategy-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 9px;
    margin-top: 0;
  }

  .strategy-card {
    min-width: 0;
    min-height: 0;
    border: 1px solid var(--mf-mobile-border);
    border-radius: var(--mf-mobile-radius);
    background: linear-gradient(145deg, rgba(14, 32, 49, .98), rgba(8, 23, 37, .98));
    box-shadow: 0 12px 28px rgba(0, 0, 0, .16);
  }

  .strategy-card.free,
  .strategy-card.vip {
    border-top: 1px solid var(--mf-mobile-border);
  }

  .strategy-card:hover {
    border-color: var(--mf-mobile-border);
    box-shadow: 0 12px 28px rgba(0, 0, 0, .16);
  }

  .strategy-card.mobile-expanded {
    border-color: #2b4c63;
  }

  .strategy-card-head {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 68px;
    padding: 12px 11px 8px;
    outline: none;
  }

  .strategy-card-head:focus-visible {
    box-shadow: inset 0 0 0 2px var(--mf-mobile-primary);
  }

  .strategy-card-head > span:first-child {
    min-width: 36px;
    height: 32px;
    border-color: rgba(255, 90, 103, .7);
    border-radius: 6px;
    color: var(--mf-mobile-up);
    background: rgba(255, 90, 103, .08);
    font-size: 11px;
  }

  .strategy-card.vip .strategy-card-head > span:first-child {
    border-color: rgba(255, 176, 32, .66);
    color: var(--mf-mobile-amber);
    background: rgba(255, 176, 32, .08);
  }

  .strategy-card h2 {
    min-width: 0;
    overflow: hidden;
    color: var(--mf-mobile-text);
    font-size: 17px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .strategy-card h2 small {
    display: none;
  }

  .status-chip {
    margin-left: 0;
    border-color: rgba(48, 212, 138, .6);
    border-radius: 6px;
    color: var(--mf-mobile-down);
    background: rgba(48, 212, 138, .08);
    padding: 5px 8px;
    font-size: 11px;
    white-space: nowrap;
  }

  .strategy-tags {
    gap: 5px;
    padding: 0 11px 10px;
  }

  .strategy-tags span {
    max-width: 100%;
    overflow: hidden;
    border-color: var(--mf-mobile-border);
    border-radius: 6px;
    color: var(--mf-mobile-muted);
    background: rgba(7, 20, 33, .42);
    padding: 4px 6px;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .strategy-summary {
    min-height: 0;
    padding: 0 11px 12px;
    color: #bec9d6;
    font-size: 12px;
    line-height: 1.7;
  }

  .metric-grid {
    margin: 0 11px;
    border: 1px solid var(--mf-mobile-border);
    border-radius: 9px;
    overflow: hidden;
  }

  .metric-grid > div {
    min-height: 64px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 9px 10px;
  }

  .metric-grid span {
    color: var(--mf-mobile-muted);
    font-size: 10px;
    white-space: nowrap;
  }

  .metric-grid strong {
    margin-top: 7px;
    font: 750 17px/1 var(--mf-mobile-number);
    white-space: nowrap;
  }

  .backtest-disclosure {
    border: 0;
    background: transparent;
    padding: 10px 12px 3px;
    color: var(--mf-mobile-muted);
    font-size: 10px;
    text-align: center;
  }

  .desktop-disclosure,
  .desktop-action-suffix {
    display: none;
  }

  .mobile-disclosure {
    display: inline;
  }

  .card-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    padding: 11px;
  }

  .card-actions .secondary-btn,
  .card-actions .primary-btn {
    min-width: 0;
    height: 46px;
    gap: 5px;
    border-color: #42637d;
    border-radius: 8px;
    color: #d5e0eb;
    background: rgba(9, 24, 39, .7);
    padding: 0 7px;
    font-size: 12px;
    white-space: nowrap;
  }

  .card-actions .primary-btn {
    border-color: var(--mf-mobile-primary);
    color: #f7ffff;
    background: linear-gradient(135deg, #149e98, #12beb1);
  }

  .strategy-read-btn {
    margin-right: 0;
  }

  .strategy-notification-btn {
    margin-right: 0;
  }

  .mobile-only-action {
    display: inline-flex;
  }

  .mobile-compact {
    position: relative;
    padding-bottom: 8px;
  }

  .mobile-compact .strategy-summary,
  .mobile-compact .backtest-disclosure,
  .mobile-compact .strategy-read-btn,
  .mobile-compact .metric-grid > div:not([data-metric="fixedReturn"]):not([data-metric="winRate"]):not([data-metric="maxDrawdown"]) {
    display: none;
  }

  .mobile-compact .metric-grid {
    width: calc(100% - 128px);
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-right: 117px;
    border: 0;
    border-radius: 0;
  }

  .mobile-compact .metric-grid > div {
    min-height: 66px;
    border-right: 1px solid var(--mf-mobile-border);
    border-bottom: 0;
    padding: 7px 7px;
  }

  .mobile-compact .metric-grid > div[data-metric="fixedReturn"] { order: 1; }
  .mobile-compact .metric-grid > div[data-metric="winRate"] { order: 2; }
  .mobile-compact .metric-grid > div[data-metric="maxDrawdown"] { order: 3; border-right: 0; }

  .mobile-compact .metric-grid span {
    overflow: hidden;
    font-size: 9px;
    text-overflow: ellipsis;
  }

  .mobile-compact .metric-grid strong {
    overflow: hidden;
    font-size: 14px;
    text-overflow: ellipsis;
  }

  .mobile-compact .card-actions {
    position: absolute;
    right: 10px;
    bottom: 10px;
    width: 104px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px;
    padding: 0;
  }

  .mobile-compact .card-actions .secondary-btn,
  .mobile-compact .card-actions .primary-btn {
    width: 100%;
    height: 42px;
  }

  .loading,
  .error-state,
  .empty-library {
    min-height: 240px;
    display: grid;
    place-items: center;
    margin: 0;
    border: 1px solid var(--mf-mobile-border);
    border-radius: var(--mf-mobile-radius);
    background: rgba(9, 24, 38, .74);
    padding: 28px;
    color: var(--mf-mobile-muted);
  }

  .error-state {
    color: var(--mf-mobile-up);
  }

  .notice-dialog {
    width: calc(100vw - 20px);
    max-height: calc(100dvh - 24px);
    border-color: var(--mf-mobile-border);
    border-radius: 16px;
    background: #0b1927;
  }

  .qmt-dialog { width: calc(100vw - 20px); }
  .qmt-dialog { min-height: 0; }
  .qmt-dialog-body { min-height: 0; max-height: calc(100dvh - 104px); padding: 14px; }
  .qmt-route { padding: 0; }
  .qmt-route li { display: grid; justify-items: center; gap: 5px; font-size: 11px; }
  .qmt-route li::after { top: 16px; left: calc(50% + 20px); width: calc(100% - 40px); }
  .qmt-create-grid { grid-template-columns: 1fr; gap: 14px; }
  .qmt-security { gap: 10px; padding: 14px 0 0; border-top: 1px solid #34495d; border-left: 0; }
  .qmt-pair-grid { grid-template-columns: 1fr; }
  .qmt-action-row { display: grid; grid-template-columns: 1fr 1fr; }
  .qmt-action-row .primary-btn { grid-column: 1 / -1; }

  .notice-dialog h2 {
    font-size: 18px;
  }

  .notice-message {
    max-height: calc(100dvh - 188px);
    color: #bec9d6;
    font-size: 13px;
  }

  .notice-dialog footer .primary-btn {
    min-height: 44px;
    border-color: var(--mf-mobile-primary);
    background: var(--mf-mobile-primary-soft);
    color: var(--mf-mobile-primary);
  }

  #mobileBottomNav {
    display: block;
  }
}

@media (max-width: 374px) {
  .mobile-strategy-header {
    grid-template-columns: minmax(74px, 1fr) auto minmax(74px, 1fr);
  }

  .mobile-strategy-back span,
  .mobile-strategy-import-note span {
    display: none;
  }

  .mobile-strategy-import-note {
    max-width: none;
  }

  .strategy-sortbar {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .strategy-sortbar > span {
    display: none;
  }

  .mobile-compact .metric-grid {
    width: calc(100% - 112px);
    margin-right: 101px;
  }

  .mobile-compact .card-actions {
    width: 90px;
  }
}

/* Finalized M05 mobile contract: normalized to the 390 x 844 acceptance viewport. */
@media (max-width: 767px) {
  .mobile-strategy-header {
    min-height: 52px;
    padding: 4px 0;
  }

  .mobile-strategy-header h1 {
    font-size: 24px;
  }

  .page-head {
    height: 38px;
  }

  .tier-tabs,
  .tier-tabs button {
    height: 38px;
  }

  .tier-tabs button {
    font-size: 18px;
  }

  .tier-tabs button::before,
  .strategy-sortbar button::before,
  .card-actions a::before,
  .card-actions button::before {
    content: "";
    position: absolute;
    z-index: 2;
    background: transparent;
  }

  .tier-tabs button::before {
    inset: -3px 0;
  }

  .mobile-strategy-status:not([hidden]) {
    min-height: 27px;
    margin: 12px 0 11px;
    padding: 0 10px;
    font-size: 11px;
  }

  .mobile-strategy-status strong,
  .mobile-strategy-status time {
    font-size: 10px;
  }

  .strategy-sortbar {
    min-height: 60px;
    height: auto;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-template-rows: 24px 28px;
    gap: 8px;
    padding: 0;
  }

  .strategy-board-filter {
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
    display: grid;
    grid-template-columns: auto repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 4px 0 0;
    padding: 4px 0 0;
    border-top: 1px solid var(--mf-mobile-border);
    border-left: 0;
  }

  .strategy-board-filter strong {
    align-self: center;
    padding-left: 4px;
    white-space: nowrap;
  }

  .strategy-sortbar > span {
    display: none;
  }

  .strategy-sortbar button {
    position: relative;
    height: 24px;
    border-radius: 6px;
    font-size: 11px;
  }

  .strategy-sortbar button::before {
    inset: -10px 0;
  }

  .strategy-sortbar > span::after {
    font-size: 9px;
  }

  .strategy-grid {
    gap: 9px;
    margin-top: 11px;
  }

  .strategy-card.mobile-expanded {
    height: 342px;
    overflow: hidden;
  }

  .strategy-card-head {
    min-height: 50px;
    padding: 9px 10px 5px;
  }

  .strategy-card-head > span:first-child {
    min-width: 34px;
    height: 28px;
    font-size: 10px;
  }

  .strategy-card h2 {
    font-size: 17px;
  }

  .status-chip {
    padding: 4px 7px;
    font-size: 10px;
  }

  .strategy-tags {
    gap: 4px;
    padding: 0 10px 7px;
  }

  .strategy-tags span {
    padding: 3px 5px;
    font-size: 9px;
  }

  .strategy-summary {
    padding: 0 10px 8px;
    font-size: 11px;
    line-height: 1.55;
  }

  .metric-grid {
    margin: 0 10px;
  }

  .strategy-card:not(.mobile-compact) .metric-grid > div {
    min-height: 61px;
    padding: 7px 9px;
  }

  .strategy-card.mobile-expanded .metric-grid {
    height: 126px;
    align-self: start;
  }

  .metric-grid strong {
    margin-top: 6px;
    font-size: 16px;
  }

  .backtest-disclosure {
    padding: 7px 10px 1px;
    font-size: 9px;
  }

  .card-actions {
    padding: 8px 10px 9px;
  }

  .card-actions .secondary-btn,
  .card-actions .primary-btn {
    position: relative;
    height: 37px;
    font-size: 11px;
  }

  .card-actions a::before,
  .card-actions button::before {
    inset: -4px 0;
  }

  .strategy-card.mobile-compact {
    height: 115px;
    padding-bottom: 4px;
    overflow: hidden;
  }

  .mobile-compact .strategy-card-head {
    min-height: 43px;
    padding: 6px 10px 2px;
  }

  .mobile-compact .strategy-tags {
    display: grid;
    grid-template-columns: 64px minmax(78px, 1fr) 48px 66px;
    gap: 4px;
    padding: 0 10px 4px;
  }

  .mobile-compact .strategy-tags span {
    min-width: 0;
    width: 100%;
    text-align: center;
  }

  .mobile-compact .metric-grid {
    width: calc(100% - 96px);
    margin-right: 86px;
  }

  .mobile-compact .metric-grid > div {
    min-height: 44px;
    padding: 5px;
  }

  .mobile-compact .metric-grid strong {
    margin-top: 5px;
    font-size: 13px;
  }

  .mobile-compact .card-actions {
    right: 10px;
    bottom: 9px;
    width: 74px;
    gap: 5px;
  }

  .mobile-compact .card-actions .secondary-btn,
  .mobile-compact .card-actions .primary-btn {
    height: 29px;
  }

  .mobile-compact .card-actions a::before,
  .mobile-compact .card-actions button::before {
    inset: -8px 0;
  }

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

  #mobileBottomNav .mf-mobile-nav a {
    min-height: 64px;
  }
}

/* Mobile feedback v2: every official strategy card shows the complete contract. */
@media (max-width: 767px) {
  .strategy-card.mobile-expanded,
  .strategy-card.mobile-compact {
    height: auto;
    min-height: 0;
    overflow: visible;
  }

  .strategy-card .metric-grid {
    width: auto;
    margin: 0 10px;
  }

  .strategy-card .metric-grid > div {
    min-height: 61px;
  }

  .strategy-card .card-actions {
    position: static;
    width: auto;
    margin: 9px 10px 10px;
  }
}
/* Member contributions share data, while each author keeps their own wording. */
.strategy-discovery{display:flex;align-items:end;gap:14px;flex-wrap:wrap;margin:22px 0 18px}
.strategy-discovery label{display:grid;gap:7px;font-size:12px;color:#9ca3af}
.strategy-discovery input,.strategy-discovery select{min-height:42px;min-width:160px;border:1px solid #34383f;border-radius:7px;background:var(--panel-bg,#11151b);color:inherit;padding:8px 12px;font:inherit;font-size:14px}
.strategy-discovery input{width:300px;max-width:100%}.strategy-discovery output{margin-left:auto;color:#9ca3af;font-size:13px;padding-bottom:12px}
.strategy-author-note{border-left:3px solid #d7b568;padding:12px 18px;line-height:1.8;margin-bottom:20px;color:#b8bdc5}
.strategy-byline{display:flex;align-items:center;gap:10px;margin:12px 0 16px;font-size:12px;color:#8c949f}
.strategy-byline button{border:0;border-bottom:1px solid transparent;padding:0;background:none;color:#d9b975;font:inherit;font-size:14px;cursor:pointer}
.strategy-byline button:hover{border-color:currentColor}.strategy-style-tags{display:flex;gap:8px;margin:10px 0 16px;font-size:12px;color:#9da6b4}
.strategy-card>.strategy-byline,.strategy-card>.strategy-style-tags{padding-left:16px;padding-right:16px}
html[data-theme="light"] .strategy-discovery input,html[data-theme="light"] .strategy-discovery select{background:var(--surface);color:var(--text);border-color:var(--line)}
html[data-theme="light"] .strategy-author-note,html[data-theme="light"] .strategy-discovery label,html[data-theme="light"] .strategy-discovery output,html[data-theme="light"] .strategy-style-tags{color:#5c6878}
html[data-theme="light"] .strategy-byline button,html[data-theme="light"] .member-byline{color:#8a5b13}
html[data-theme="light"] .strategy-sortbar button{background:#edf2f7;color:#263a50;border-color:#cdd7e2}
html[data-theme="light"] .strategy-sortbar button.active{background:#9c343d;color:#fff;border-color:#9c343d}
html[data-theme="light"] .topbar .theme-switcher button:not(.active),html[data-theme="light"] .topbar .auth-login-btn,html[data-theme="light"] .topbar .contact-support-entry{color:#dbe7f4}
.strategy-number{display:flex;justify-content:flex-end;margin-top:12px}.strategy-number button{background:none;border:0;font:inherit;font-size:11px;color:#8b939f;cursor:pointer}
.member-byline{color:#cfb67e;font-size:13px}.member-paragraph{font-size:16px;line-height:1.95;margin:18px 0}.editorial-credit{display:block;color:#9299a4;margin-top:22px}
.strategy-rule-details{border-top:1px solid #353941;margin-top:24px;padding-top:16px;line-height:1.8}.strategy-rule-details summary{cursor:pointer;color:#aeb8c8}
@media(max-width:767px){.strategy-discovery{gap:10px;margin:14px 0}.strategy-discovery label:first-child{width:100%}.strategy-discovery input{width:100%;box-sizing:border-box}.strategy-discovery select{min-width:130px;max-width:165px}.strategy-discovery output{width:100%;padding:0}.strategy-byline{margin:10px 0}.member-paragraph{font-size:15px}.strategy-author-note{font-size:13px}}

html[data-theme="light"] #mobileStrategyName{color:#142b42}

/* Member cards own their layout; the retired expandable-card grid does not. */
.member-strategy-card{min-width:0;display:flex;flex-direction:column;padding:20px;border:1px solid #345268;border-radius:7px;background:var(--surface);transition:border-color .15s,box-shadow .15s}
.member-strategy-card:hover{border-color:#6588a0;box-shadow:0 6px 18px #0002}
.member-card-author-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px;min-width:0}
.member-author{display:flex;align-items:center;gap:12px;padding:0;border:0;background:none;color:var(--text);text-decoration:none;text-align:left;min-width:0}
.member-author strong{font-size:19px;font-weight:750;line-height:1.4;white-space:nowrap}
.member-author small{font-size:13px;color:#a5b4c5;white-space:nowrap}
.member-avatar{flex:0 0 46px;width:46px;height:46px;display:grid;place-items:center;border-radius:50%;border:1px solid #ffffff38;font-size:24px;font-weight:700;color:#fff}
.member-avatar-0{background:#846226}.member-avatar-1{background:#355e97}.member-avatar-2{background:#376d45}.member-avatar-3{background:#635394}.member-avatar-4{background:#28777d}.member-avatar-5{background:#80544c}
.member-tier{padding:7px 12px;border:1px solid #9b7836;border-radius:5px;background:#2b2418;color:#ffd474;font-size:13px;font-weight:750;flex:none}
.member-strategy-card.free .member-tier{color:#ffafb5;border-color:#855462;background:#301e29}
.member-card-content{display:block;flex:1;min-width:0;color:inherit;text-decoration:none;border-radius:3px}
a.member-card-content,a.member-card-content *{cursor:pointer}
a.member-card-content:hover h2{color:#ffd474}
.member-card-content:focus-visible,.member-author:focus-visible,.member-card-actions :focus-visible{outline:2px solid #87c9ff;outline-offset:5px}
.member-card-content h2{margin:0 0 12px;font-size:24px;line-height:1.35;color:var(--text);letter-spacing:0}
.member-card-tags{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:10px}
.member-card-tags span{padding:3px 8px;border:1px solid #345268;border-radius:4px;font-size:13px;line-height:1.4;color:#b7cbe0;background:#182a3a}
.member-card-summary{margin:0 0 12px;color:#b9c9da;font-size:15px;line-height:1.6;min-height:48px;white-space:pre-line;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.member-strategy-card .metric-grid{margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-color:#263e51;background:transparent}
.member-strategy-card .metric-grid>div{padding:8px 0 10px 12px;border-color:#263e51;min-height:65px;background:transparent}
.member-strategy-card .metric-grid>div:nth-child(3n+1){padding-left:0}
.member-strategy-card .metric-grid span{font-size:12px;color:#a5b7ca;line-height:1.5}
.member-strategy-card .metric-grid strong{font-size:24px;margin-top:3px;line-height:1.3}
.member-strategy-card .metric-grid>div:nth-child(n+4) strong{font-size:21px}
.member-card-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:8px 0 12px;color:#95abc0;font-size:12px;line-height:1.5}
.member-card-meta p{margin:0}.member-card-meta button{flex:none;border:0;background:none;color:inherit;padding:3px 0;font-size:12px;cursor:pointer}
.member-strategy-card .member-card-actions{display:flex;flex-wrap:nowrap;align-items:stretch;justify-content:space-between;gap:7px;padding:0;margin:0;border:0;background:none}
.member-card-actions .primary-btn,.member-card-actions .secondary-btn{display:flex;align-items:center;justify-content:center;min-height:42px;flex:1;min-width:0;padding:7px 5px;font-size:13px;line-height:1.3;white-space:nowrap;border-radius:5px;margin:0}
.member-card-actions .primary-btn{flex:1.25}.member-card-actions .mobile-only-action{display:none}
.member-note{padding:24px;color:var(--text);line-height:1.6}
.member-note .member-author{margin-bottom:16px}.member-note .member-author strong{color:#ffd474;font-size:18px}
.member-note h2{padding:0;margin:0;font-size:24px;line-height:1.4;color:var(--text)}
.member-note-subtitle{margin:4px 0 16px;color:#aab9cb;font-size:13px}
.member-note blockquote{margin:0 0 18px;padding:12px 15px;border:1px solid #5f54393d;border-left:4px solid #ecc16b;border-radius:6px;background:#dfbb6210;color:#f5d795;font-size:15px;font-weight:600;line-height:1.6}
.member-note-section{margin:16px 0}.member-note-section h3{margin:0 0 5px;color:#efc878;font-size:16px;font-weight:650}
.member-note-section p{margin:0;white-space:pre-line;font-size:15px;line-height:1.7;color:var(--text)}
.member-note-credit{border-top:1px solid var(--line);padding-top:12px;margin-top:18px;font-size:12px;color:#93a5b9}
.notice-dialog .member-note-credit{display:block;padding:18px 0 0}
.member-note-actions{display:flex;justify-content:space-between;gap:15px;margin-top:20px}
.member-note-actions a,.member-note-actions button{min-height:44px}
.member-note-close{display:none}
.notice-dialog.is-author-note{width:min(760px,calc(100vw - 40px));max-height:calc(100dvh - 40px);border-color:#466278;overflow:hidden}
.notice-dialog.is-author-note>h2,.notice-dialog.is-author-note>footer{display:none}
.notice-dialog.is-author-note .notice-message{padding:0;max-height:calc(100dvh - 44px);overflow:auto}
.notice-dialog.is-author-note .member-note-close{display:block;position:absolute;right:16px;top:16px;width:36px;height:36px;padding:0;border:0;background:var(--surface);color:#b8c6d7;font-size:28px;line-height:1;border-radius:50%;z-index:2;cursor:pointer}
#strategyMemberIntroduction{grid-column:1/-1;min-width:0;width:100%;margin:12px 0;padding:12px 16px;border:1px solid var(--line);border-radius:8px;background:var(--surface);display:flex;align-items:center;justify-content:space-between;gap:12px}
#strategyMemberIntroduction .member-author{min-width:0;gap:8px;flex-wrap:wrap}
#strategyMemberIntroduction .member-avatar{width:32px;height:32px;flex-basis:32px;font-size:18px}
#strategyMemberIntroduction .member-author strong{font-size:16px}
#strategyMemberIntroduction .member-author small{font-size:12px}
#strategyIntroductionButton{flex:none;min-height:36px;font-size:13px;padding:7px 12px}
html[data-theme="light"] .member-strategy-card{border-color:#c4d2dd;background:#fff}
html[data-theme="light"] .member-card-summary,html[data-theme="light"] .member-author small,html[data-theme="light"] .member-card-meta,html[data-theme="light"] .member-strategy-card .metric-grid span{color:#52677b}
html[data-theme="light"] .member-card-tags span{background:#f1f5f8;border-color:#c1d0dc;color:#435c74}
html[data-theme="light"] .member-strategy-card .metric-grid,html[data-theme="light"] .member-strategy-card .metric-grid>div{border-color:#d5e0e8}
html[data-theme="light"] .member-note .member-author strong,html[data-theme="light"] .member-note-section h3,html[data-theme="light"] a.member-card-content:hover h2{color:#835b12}
html[data-theme="light"] .member-note blockquote{background:#fff7e7;color:#755314}
html[data-theme="light"] .member-note-subtitle,html[data-theme="light"] .member-note-credit{color:#596f83}
/* Desktop density stays constant as the monitor widens. */
@media(min-width:768px){
  .strategy-grid{margin-left:0;margin-right:0;gap:14px}
  .member-strategy-card{padding:14px}
  .member-card-author-row{margin-bottom:10px;gap:10px}
  .member-strategy-card .member-avatar{width:36px;height:36px;flex-basis:36px;font-size:20px}
  .member-strategy-card .member-author{gap:9px}
  .member-strategy-card .member-author strong{font-size:17px}
  .member-strategy-card .member-author small{font-size:12px}
  .member-tier{font-size:12px;padding:5px 9px}
  .member-card-content h2{font-size:21px;line-height:1.25;margin-bottom:8px}
  .member-card-tags{gap:6px;margin-bottom:8px}
  .member-card-tags span{font-size:12px;padding:2px 7px}
  .member-card-summary{font-size:14px;line-height:1.45;min-height:40.6px;margin-bottom:9px}
  .member-strategy-card .metric-grid>div{min-height:50px;padding-top:5px;padding-bottom:5px}
  .member-strategy-card .metric-grid span{font-size:11px;line-height:1.4}
  .member-strategy-card .metric-grid strong{font-size:20px;line-height:1.2;margin-top:2px}
  .member-strategy-card .metric-grid>div:nth-child(n+4) strong{font-size:18px}
  .member-card-meta{font-size:11px;margin:6px 0 9px}
  .member-card-meta button{font-size:11px}
  .member-card-actions .primary-btn,.member-card-actions .secondary-btn{font-size:12px;min-height:34px;padding:6px 5px;white-space:normal}
}
@media(max-width:767px){.member-strategy-card{padding:15px;margin:0;border-radius:8px}.member-card-author-row{margin-bottom:16px}.member-avatar{width:40px;height:40px;flex-basis:40px;font-size:22px}.member-author{gap:9px}.member-author strong{font-size:18px}.member-author small{font-size:12px}.member-tier{font-size:12px;padding:5px 9px}.member-card-content h2{font-size:22px;margin-bottom:10px}.member-card-summary{font-size:14px;min-height:44px}.member-strategy-card .metric-grid>div{min-height:60px;padding:7px 0 8px 8px}.member-strategy-card .metric-grid span{font-size:11px}.member-strategy-card .metric-grid strong{font-size:21px}.member-strategy-card .metric-grid>div:nth-child(n+4) strong{font-size:19px}.member-card-meta{font-size:11px;gap:5px}.member-card-meta button{font-size:11px}.member-strategy-card .member-card-actions{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}.member-card-actions>:nth-child(-n+3){grid-column:span 2}.member-card-actions>:nth-child(n+4){grid-column:span 3}.member-card-actions .primary-btn,.member-card-actions .secondary-btn{min-height:42px;font-size:13px}.member-note{padding:22px 18px}.member-note .member-author{padding-right:25px;gap:8px}.member-note .member-author strong{font-size:20px}.member-note .member-author small{font-size:12px}.member-note h2{font-size:26px}.member-note blockquote{padding:14px 15px;font-size:16px}.member-note-section h3{font-size:18px}.member-note-section p{font-size:16px}.notice-dialog.is-author-note{width:calc(100vw - 20px);max-height:calc(100dvh - 24px)}.notice-dialog.is-author-note .notice-message{max-height:calc(100dvh - 28px)}#strategyMemberIntroduction{margin:16px 0} }
