.mobile-screener {
  display: none;
}

/* Mobile full-audit fixes: named rule groups, touch targets and official-strategy emphasis. */
@media (max-width: 767px) {
  .mobile-help-btn {
    width: 40px;
    height: 40px;
    min-width: 40px;
    min-height: 40px;
  }

  .mobile-snapshot-row label,
  .mobile-workspace-snapshot label {
    min-height: 40px;
  }

  #mobileCurrentStrategySelect,
  .mobile-strategy-links button,
  .mobile-strategy-links a,
  .mobile-condition-tabs button,
  .mobile-edit-conditions {
    min-height: 40px;
  }

  .mobile-strategy-links {
    flex-basis: 158px;
  }

  #mobileOfficialStrategiesLink {
    position: relative;
    display: grid;
    overflow: hidden;
    grid-template-columns: 20px minmax(0, auto);
    place-content: center;
    align-items: center;
    gap: 5px;
    border-color: rgba(255, 190, 70, .88);
    background:
      linear-gradient(135deg, rgba(24, 174, 177, .96), rgba(8, 91, 105, .98));
    box-shadow:
      0 0 0 1px rgba(255, 205, 103, .18) inset,
      0 0 16px rgba(45, 211, 198, .22);
    color: #fff;
    font-weight: 800;
    letter-spacing: .02em;
    text-shadow: 0 1px 0 rgba(0, 23, 33, .5);
  }

  #mobileOfficialStrategiesLink::after {
    position: absolute;
    top: -20px;
    left: -32px;
    width: 24px;
    height: 80px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .28), transparent);
    content: "";
    pointer-events: none;
    transform: rotate(24deg);
  }

  #mobileOfficialStrategiesLink:active {
    filter: brightness(.94);
    transform: translateY(1px);
  }

  .mobile-official-strategy-icon {
    display: grid;
    width: 20px;
    height: 20px;
    place-items: center;
    border-radius: 5px;
    background: rgba(255, 255, 255, .14);
  }

  .mobile-official-strategy-icon svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: #fff;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.7;
  }

  #mobileOfficialStrategiesLink strong {
    min-width: 0;
    overflow: hidden;
    font: inherit;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-workspace-group-title {
    display: inline-flex !important;
    align-items: center;
    gap: 3px;
  }

  .mobile-workspace-group-title strong {
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-workspace-group-title button {
    display: grid;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    place-items: center;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #b9c9d6;
    font-size: 18px;
  }

  .mobile-workspace-rule {
    grid-template-columns: 16px minmax(70px, 1fr) minmax(42px, auto) minmax(42px, 70px) 40px 40px;
  }

  .mobile-workspace-rule > button,
  .mobile-workspace-inline-add button,
  .mobile-workspace-group-actions button,
  .mobile-workspace-collapse,
  .mobile-strategy-card > footer button {
    min-height: 40px;
  }

  .mobile-workspace-rule > button {
    width: 40px;
    min-width: 40px;
    padding: 0;
  }

  .mobile-group-name-dialog {
    width: min(360px, calc(100vw - 28px));
    max-width: 360px;
    margin: auto;
    padding: 0;
    border: 1px solid rgba(54, 215, 192, .64);
    border-radius: 14px;
    background: linear-gradient(145deg, #0b2133, #071724);
    box-shadow: 0 18px 60px rgba(0, 0, 0, .58), 0 0 24px rgba(54, 215, 192, .1);
    color: #eef5fa;
  }

  .mobile-group-name-dialog::backdrop {
    background: rgba(0, 8, 15, .72);
    backdrop-filter: blur(3px);
  }

  .mobile-group-name-dialog > form {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 10px 12px;
    padding: 18px;
  }

  .mobile-group-name-icon {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border: 1px solid rgba(255, 190, 70, .78);
    border-radius: 12px;
    background: linear-gradient(145deg, rgba(27, 155, 159, .46), rgba(6, 61, 74, .76));
    color: #ffd27a;
    font-size: 23px;
  }

  .mobile-group-name-dialog h2 {
    margin: 0;
    font-size: 18px;
    line-height: 1.25;
  }

  .mobile-group-name-dialog p {
    margin: 4px 0 0;
    color: #8fa6b8;
    font-size: 12px;
    line-height: 1.45;
  }

  .mobile-group-name-dialog label,
  .mobile-group-name-dialog input,
  .mobile-group-name-dialog .mobile-group-name-error,
  .mobile-group-name-dialog form > div:last-child {
    grid-column: 1 / -1;
  }

  .mobile-group-name-dialog label {
    margin-top: 3px;
    color: #b8c7d2;
    font-size: 12px;
  }

  .mobile-group-name-dialog input {
    width: 100%;
    min-height: 48px;
    box-sizing: border-box;
    padding: 0 13px;
    border: 1px solid #37526a;
    border-radius: 9px;
    outline: 0;
    background: #071827;
    color: #f3f8fb;
    font-size: 16px;
  }

  .mobile-group-name-dialog input:focus {
    border-color: var(--m-primary);
    box-shadow: 0 0 0 3px rgba(54, 215, 192, .12);
  }

  .mobile-group-name-dialog .mobile-group-name-error {
    margin: -4px 0 0;
    color: var(--m-up);
    font-size: 12px;
  }

  .mobile-group-name-dialog form > div:last-child {
    display: grid;
    grid-template-columns: 1fr 1.25fr;
    gap: 9px;
    margin-top: 4px;
  }

  .mobile-group-name-dialog form > div:last-child button {
    min-height: 46px;
    border: 1px solid #4e667b;
    border-radius: 9px;
    background: transparent;
    color: #c6d2dc;
    font-size: 14px;
    font-weight: 750;
  }

  #mobileGroupNameConfirm {
    border-color: rgba(54, 215, 192, .84);
    background: linear-gradient(135deg, #22c7bb, #13a8a8);
    color: #031a21;
  }
}

@media (max-width: 340px) {
  .mobile-workspace-section > header {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) auto;
    gap: 6px;
  }

  .mobile-workspace-section > header > h2 {
    overflow: hidden;
    font-size: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-workspace-section > header > .mobile-workspace-collapse {
    grid-column: 3;
    grid-row: 1;
  }

  .mobile-workspace-section > header > select,
  .mobile-workspace-section > header > span {
    width: 100%;
    max-width: none;
    grid-column: 2 / 4;
    grid-row: 2;
  }

  .mobile-workspace-rule {
    grid-template-columns: 14px minmax(58px, 1fr) minmax(38px, auto) minmax(40px, 58px) 36px 36px;
    gap: 2px;
  }

  .mobile-workspace-rule > button {
    width: 36px;
    min-width: 36px;
  }
}

/* Mobile tutorial library: follows the compact screener visual language. */
@media (max-width: 767px) {
  .mobile-video-tutorial-btn {
    position: relative;
    display: flex;
    width: 106px;
    min-width: 106px;
    height: 42px;
    min-height: 42px;
    padding: 0 10px 0 8px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid rgba(91, 203, 255, .95);
    border-radius: 8px;
    background: linear-gradient(145deg, #25b4ff 0%, #1984ee 48%, #315bea 100%);
    box-shadow: 0 0 0 1px rgba(71, 189, 255, .18), 0 6px 16px rgba(14, 103, 221, .45), inset 0 1px rgba(255, 255, 255, .28);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
  }

  .mobile-video-tutorial-btn > i {
    position: absolute;
    top: -7px;
    right: -7px;
    display: grid;
    width: 20px;
    height: 20px;
    place-items: center;
    border: 2px solid #06111c;
    border-radius: 50%;
    background: #f23643;
    box-shadow: 0 2px 7px rgba(242, 54, 67, .5);
    color: #fff;
    font-size: 11px;
    font-style: normal;
    font-weight: 900;
    line-height: 1;
    box-sizing: border-box;
  }

  .mobile-video-tutorial-icon {
    position: relative;
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 2px 7px rgba(7, 73, 174, .28);
  }

  .mobile-video-tutorial-icon::after {
    content: "";
    position: absolute;
    top: 7px;
    left: 9px;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 7px solid #1c7ce9;
  }

  .mobile-video-tutorial-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    line-height: 1.05;
  }

  .mobile-video-tutorial-copy small {
    color: #dff6ff;
    font-size: 9px;
    font-weight: 750;
  }

  .mobile-video-tutorial-copy strong {
    margin-top: 3px;
    color: #fff;
    font-size: 12px;
    font-weight: 900;
  }

  .mobile-tutorial-library:not([hidden]) {
    min-height: 100dvh;
    padding: 8px 10px 92px;
  }

  .mobile-tutorial-head {
    grid-template-columns: 44px minmax(0, 1fr) 44px;
  }

  .mobile-tutorial-count {
    display: grid;
    min-width: 42px;
    height: 28px;
    place-items: center;
    border: 1px solid rgba(53, 215, 192, .4);
    border-radius: 6px;
    background: rgba(12, 76, 77, .24);
    color: #65e6d3;
    font-size: 11px;
    font-weight: 750;
  }

  .mobile-tutorial-status {
    display: flex;
    min-height: 42px;
    margin: 10px 0 12px;
    padding: 0 12px;
    align-items: center;
    justify-content: space-between;
    border: 1px solid var(--m-line);
    border-radius: 7px;
    background: rgba(13, 27, 42, .84);
  }

  .mobile-tutorial-status span {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #62e3d1;
    font-size: 12px;
  }

  .mobile-tutorial-status span > i {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #37d7c0;
    box-shadow: 0 0 10px rgba(55, 215, 192, .55);
  }

  .mobile-tutorial-status small {
    color: var(--m-muted);
    font-size: 10px;
  }

  .mobile-tutorial-list {
    display: grid;
    gap: 12px;
  }

  .mobile-tutorial-card {
    display: grid;
    gap: 10px;
    padding: 10px;
    border: 1px solid var(--m-line);
    border-radius: 8px;
    background: rgba(13, 27, 42, .88);
  }

  .mobile-tutorial-cover {
    position: relative;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    border: 1px solid rgba(57, 92, 119, .74);
    border-radius: 6px;
    background: #08131f;
  }

  .mobile-tutorial-cover > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .mobile-tutorial-cover::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 55%, rgba(3, 9, 15, .62));
    pointer-events: none;
  }

  .mobile-tutorial-state {
    position: absolute;
    z-index: 2;
    top: 8px;
    right: 8px;
    display: grid;
    min-height: 26px;
    padding: 0 9px;
    place-items: center;
    border-radius: 5px;
    font-size: 11px;
    font-weight: 800;
  }

  .mobile-tutorial-state.ready {
    border: 1px solid rgba(72, 229, 207, .75);
    background: rgba(16, 118, 111, .88);
    color: #eafffb;
  }

  .mobile-tutorial-state.pending {
    border: 1px solid rgba(227, 165, 38, .72);
    background: rgba(105, 66, 5, .88);
    color: #ffc84f;
  }

  .mobile-tutorial-cover-play {
    position: absolute;
    z-index: 3;
    top: 50%;
    left: 50%;
    display: grid;
    width: 58px;
    height: 58px;
    min-height: 58px;
    padding: 0;
    place-items: center;
    border: 1px solid rgba(255, 112, 119, .9);
    border-radius: 50%;
    background: rgba(214, 41, 53, .9);
    box-shadow: 0 6px 22px rgba(0, 0, 0, .38);
    transform: translate(-50%, -50%);
  }

  .mobile-tutorial-cover-play > span {
    margin-left: 4px;
    border-top: 9px solid transparent;
    border-bottom: 9px solid transparent;
    border-left: 14px solid #fff;
  }

  .mobile-tutorial-card-copy h2 {
    margin: 0;
    color: #f3f7fb;
    font-size: 17px;
    line-height: 1.35;
  }

  .mobile-tutorial-card-copy p {
    margin: 5px 0 0;
    color: #9eb0c1;
    font-size: 12px;
    line-height: 1.5;
  }

  .mobile-tutorial-card-copy small {
    display: block;
    margin-top: 7px;
    color: #93a9bb;
    font-size: 11px;
  }

  .mobile-tutorial-play,
  .mobile-tutorial-wait {
    width: 100%;
    min-height: 44px;
    border-radius: 6px;
    font-size: 15px;
    font-weight: 800;
  }

  .mobile-tutorial-play {
    border: 1px solid #6de5d3;
    background: linear-gradient(110deg, #2fbcae, #52d8ca);
    color: #f8ffff;
  }

  .mobile-tutorial-wait {
    border: 1px solid rgba(94, 116, 136, .7);
    background: rgba(38, 54, 70, .82);
    color: #98a9b9;
  }

  .mobile-tutorial-pending-cover {
    display: grid;
    place-items: center;
    background:
      linear-gradient(rgba(4, 12, 20, .65), rgba(4, 12, 20, .65)),
      url("./assets/tutorial/episode-01-poster-v1.jpg") center / cover;
    filter: saturate(.35);
  }

  .mobile-tutorial-film {
    position: relative;
    z-index: 2;
    display: grid;
    width: 66px;
    height: 48px;
    place-items: center;
    border: 3px solid #9ba8b5;
    border-radius: 5px;
    opacity: .8;
  }

  .mobile-tutorial-film::before {
    content: "";
    position: absolute;
    top: -13px;
    left: -3px;
    width: 66px;
    height: 10px;
    border: 3px solid #9ba8b5;
    border-radius: 3px 3px 0 0;
    background: repeating-linear-gradient(115deg, #9ba8b5 0 7px, transparent 7px 13px);
  }

  .mobile-tutorial-film > i {
    margin-left: 3px;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 12px solid #aeb8c3;
  }

  .mobile-tutorial-more {
    margin: 14px 0 0;
    color: #8ea1b3;
    font-size: 11px;
    text-align: center;
  }

  .mobile-tutorial-player {
    width: min(94vw, 820px);
    max-width: none;
    padding: 0;
    border: 1px solid rgba(70, 105, 132, .9);
    border-radius: 9px;
    background: #050b12;
    color: #eef7fb;
  }

  .mobile-tutorial-player::backdrop {
    background: rgba(0, 0, 0, .9);
  }

  .mobile-tutorial-player > div {
    display: grid;
    gap: 8px;
    padding: 10px;
  }

  .mobile-tutorial-player header {
    display: flex;
    min-height: 38px;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }

  .mobile-tutorial-player header strong {
    overflow: hidden;
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-tutorial-player header button {
    width: 38px;
    height: 38px;
    min-height: 38px;
    border: 1px solid rgba(103, 129, 150, .72);
    border-radius: 50%;
    background: rgba(20, 36, 51, .9);
    color: #edf5fa;
    font-size: 23px;
  }

  .mobile-tutorial-player video {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    background: #000;
  }

  .mobile-tutorial-player p {
    margin: 0 0 2px;
    color: #8fa5b7;
    font-size: 11px;
    text-align: center;
  }
}

/* 2026-08-03 mobile feedback v2: natural page scroll and complete rule/result surfaces. */
@media (max-width: 767px) {
  .mobile-screener:not([hidden]) {
    position: relative;
    height: auto;
    min-height: 100dvh;
    padding-bottom: calc(82px + env(safe-area-inset-bottom));
    overflow: visible;
  }

  .mobile-snapshot-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    height: auto;
    gap: 7px;
    padding-bottom: 7px;
  }

  .mobile-snapshot-row label {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    width: 100%;
    height: 36px;
    min-height: 36px;
    box-sizing: border-box;
  }

  .mobile-snapshot-row label > span,
  .mobile-snapshot-row select {
    min-width: 0;
  }

  .mobile-snapshot-row select {
    width: 100%;
    max-width: 100%;
  }

  .mobile-snapshot-row > small {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-self: start;
    white-space: normal;
  }

  .mobile-current-strategy {
    height: auto;
    min-height: 58px;
  }

  .mobile-current-strategy-copy {
    min-width: 0;
  }

  #mobileCurrentStrategySelect {
    width: min(48vw, 190px);
    min-width: 0;
    min-height: 28px;
    margin-top: 2px;
    padding: 0 26px 0 7px;
    border: 1px solid var(--m-line);
    border-radius: 6px;
    background: #091827;
    color: #f0f4f8;
    font-size: 12px;
    font-weight: 700;
  }

  .mobile-condition-summary {
    height: auto;
    min-height: 62px;
    align-items: start;
  }

  .mobile-condition-chips {
    display: flex;
    flex-wrap: wrap;
    max-height: none;
    overflow: visible;
  }

  .mobile-condition-chips > span {
    width: auto;
  }

  .mobile-result-section {
    position: static;
    width: auto;
    height: auto;
    margin-top: 18px;
    overflow: visible;
  }

  .mobile-result-list {
    height: auto;
    max-height: none;
    overflow: visible;
  }

  .mobile-result-card,
  .mobile-result-card.top-ranked {
    grid-template-columns: minmax(0, 1fr) 64px;
    grid-template-areas:
      "identity action"
      "metrics metrics";
    height: auto;
    min-height: 104px;
    gap: 8px;
    padding: 10px;
  }

  .mobile-result-card.top-ranked .mobile-stock-identity {
    padding-left: 44px;
  }

  .mobile-stock-identity {
    grid-area: identity;
  }

  .mobile-stock-code {
    display: flex !important;
    align-items: center;
    gap: 5px;
  }

  .mobile-stock-code button {
    width: 24px;
    height: 24px;
    min-height: 24px;
    padding: 0;
    border: 1px solid var(--m-line);
    border-radius: 5px;
    background: rgba(13, 31, 47, .8);
    color: var(--m-muted);
    font-size: 11px;
  }

  .mobile-stock-metrics {
    grid-area: metrics;
    display: grid;
    grid-template-columns: .8fr .85fr .95fr minmax(0, 1.4fr);
    gap: 6px;
  }

  .mobile-stock-metrics > div {
    min-width: 0;
  }

  .mobile-stock-metrics span,
  .mobile-stock-metrics strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-stock-metrics strong {
    margin-top: 4px;
    font-size: 11px;
    overflow-wrap: normal;
  }

  .mobile-stock-industry strong {
    white-space: nowrap;
  }

  .mobile-add-holding {
    grid-area: action;
    width: 64px;
    min-width: 64px;
    min-height: 40px;
  }

  .mobile-result-tools {
    display: none !important;
  }

  .mobile-browser-boundary {
    position: static;
    width: auto;
    height: auto;
    margin: 12px 0 0;
    line-height: 1.5;
    white-space: normal;
  }

  .mobile-load-more:not([hidden]) {
    display: block;
    width: 100%;
    min-height: 42px;
    margin-top: 10px;
  }

  .mobile-workspace-section > header {
    flex-wrap: wrap;
  }

  .mobile-workspace-collapse {
    min-height: 30px;
    margin-left: auto;
    padding: 0 8px;
    border: 1px solid rgba(54, 215, 192, .55);
    border-radius: 6px;
    background: rgba(7, 62, 69, .28);
    color: var(--m-primary);
    font-size: 10px;
    white-space: nowrap;
  }

  .mobile-workspace-rule-list,
  .mobile-workspace-chips,
  .mobile-workspace-sort-list {
    max-height: none;
    overflow: visible;
  }

  .mobile-workspace-chips {
    flex-wrap: wrap;
  }

  .mobile-workspace-section.collapsed > :not(header) {
    display: none !important;
  }

  .mobile-workspace-actions {
    position: sticky;
    right: auto;
    bottom: 0;
    left: auto;
    margin: 12px 0 0;
  }
}

/* M04 V1.1: 390x844 first-screen contract. The result list scrolls internally;
   result actions and the primary navigation remain resident. */
@media (min-width: 351px) and (max-width: 767px) and (max-height: 900px) {
  .mobile-screener:not([hidden]) {
    position: relative;
    height: 100dvh;
    min-height: 0;
    padding: 18px 12px 60px;
    overflow: hidden;
  }

  .mobile-screener button,
  .mobile-screener select,
  .mobile-screener a {
    min-height: 0;
  }

  .mobile-screener-head {
    height: 48px;
    padding: 0 4px 5px;
  }

  .mobile-screener-head h1 {
    font-size: 22px;
  }

  .mobile-screener-head p {
    margin-top: 3px;
    font-size: 11px;
  }

  .mobile-help-btn {
    width: 28px;
    height: 28px;
    min-height: 28px !important;
    font-size: 18px;
  }

  .mobile-snapshot-row {
    grid-template-columns: minmax(0, 1.18fr) minmax(0, 0.92fr) minmax(78px, 0.82fr);
    height: 34px;
    gap: 7px;
    padding: 0 0 7px;
  }

  .mobile-snapshot-row label {
    min-height: 27px;
    height: 27px;
    padding: 0 7px;
    border-radius: 5px;
  }

  .mobile-snapshot-row label > span,
  .mobile-snapshot-row select,
  .mobile-snapshot-row > small {
    font-size: 10px;
  }

  .mobile-snapshot-row select {
    padding-left: 4px;
  }

  .mobile-snapshot-row > small {
    grid-column: 3;
    grid-row: 1;
    align-self: center;
    justify-self: start;
    margin: 0;
    padding: 0;
    white-space: nowrap;
  }

  .mobile-package-status {
    height: 30px;
    min-height: 30px;
    margin-bottom: 7px;
    padding: 0 8px;
    border-radius: 5px;
  }

  .mobile-package-copy strong,
  .mobile-package-status > b {
    font-size: 11px;
  }

  .mobile-current-strategy {
    height: 50px;
    min-height: 50px;
    margin-bottom: 6px;
    padding: 5px 9px;
    border-radius: 6px;
  }

  .mobile-current-strategy-copy > span {
    font-size: 9px;
  }

  .mobile-current-strategy-copy strong {
    max-width: 145px;
    margin-top: 2px;
    font-size: 12px;
  }

  .mobile-current-strategy-copy em {
    min-height: 18px;
    margin-top: 2px;
    padding: 0 5px;
    font-size: 8px;
  }

  .mobile-strategy-links {
    flex-basis: 136px;
    gap: 5px;
  }

  .mobile-strategy-links button,
  .mobile-strategy-links a {
    min-height: 32px;
    font-size: 11px;
  }

  .mobile-condition-tabs {
    height: 34px;
    margin-top: 5px;
  }

  .mobile-condition-tabs button {
    min-height: 34px;
    font-size: 13px;
  }

  .mobile-condition-summary {
    height: 62px;
    min-height: 62px;
    padding: 8px 0;
  }

  .mobile-condition-chips {
    max-height: 46px;
    gap: 5px;
    overflow: hidden;
  }

  .mobile-condition-chips > span {
    min-height: 25px;
    padding: 0 8px;
    border-radius: 5px;
    font-size: 9px;
  }

  .mobile-edit-conditions {
    min-width: 78px;
    min-height: 28px;
    padding: 0 7px;
    font-size: 10px;
  }

  .mobile-selection-summary {
    height: 76px;
    min-height: 76px;
    padding: 9px;
    border-radius: 6px;
  }

  .mobile-selection-summary span {
    font-size: 9px;
  }

  .mobile-selection-summary strong {
    margin-top: 5px;
    font-size: 16px;
  }

  #mobileRunBtn {
    min-height: 40px;
    font-size: 14px;
  }

  .mobile-result-section {
    position: absolute;
    top: 405px;
    right: 12px;
    left: 12px;
    height: 318px;
    margin: 0;
    overflow: hidden;
  }

  .mobile-result-head {
    height: 48px;
    min-height: 48px;
  }

  .mobile-result-head h2 {
    font-size: 17px;
  }

  .mobile-holdings-switch {
    font-size: 10px;
  }

  .mobile-holdings-switch i {
    width: 31px;
    height: 18px;
  }

  .mobile-holdings-switch i::after {
    top: 2px;
    left: 2px;
    width: 14px;
    height: 14px;
  }

  .mobile-holdings-switch input:checked + i::after {
    transform: translateX(13px);
  }

  .mobile-result-list {
    height: 270px;
    max-height: 270px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
  }

  .mobile-result-card {
    grid-template-columns: minmax(82px, 0.95fr) minmax(44px, 0.5fr) minmax(126px, 1.45fr) 46px;
    grid-template-areas: "identity price metrics action";
    height: 67px;
    min-height: 67px;
    column-gap: 3px;
    row-gap: 0;
    padding: 6px 6px;
  }

  .mobile-result-card.top-ranked {
    height: 69px;
    min-height: 69px;
  }

  .mobile-rank-badge {
    top: 11px;
    left: 6px;
    width: 34px;
    height: 34px;
    font-size: 9px;
  }

  .mobile-result-card.top-ranked .mobile-stock-identity {
    padding-left: 38px;
  }

  .mobile-stock-identity a {
    font-size: 12px;
  }

  .mobile-stock-identity > span,
  .mobile-stock-price > span {
    margin-top: 3px;
    font-size: 9px;
  }

  .mobile-stock-price strong {
    font-size: 12px;
  }

  .mobile-stock-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: center;
    gap: 2px;
  }

  .mobile-stock-metrics > div {
    min-width: 0;
  }

  .mobile-stock-metrics span,
  .mobile-stock-metrics strong {
    display: block;
    white-space: nowrap;
  }

  .mobile-stock-metrics span {
    overflow: hidden;
    font-size: 7px;
    text-overflow: ellipsis;
  }

  .mobile-stock-metrics strong {
    margin-top: 3px;
    font-size: 9px;
    letter-spacing: -0.15px;
    line-height: 1.05;
    overflow-wrap: anywhere;
    white-space: normal;
  }

  .mobile-add-holding {
    width: 46px;
    min-width: 46px;
    min-height: 31px;
    padding: 0 3px;
    font-size: 9px;
  }

  .mobile-result-empty {
    min-height: 270px;
    padding: 18px;
  }

  .mobile-result-tools {
    position: absolute;
    right: 12px;
    bottom: 84px;
    left: 12px;
    height: 34px;
    margin: 0;
  }

  .mobile-result-tools button {
    min-height: 34px;
    border-radius: 5px;
    font-size: 10px;
  }

  .mobile-result-tools button span {
    font-size: 13px;
  }

  .mobile-browser-boundary {
    position: absolute;
    right: 8px;
    bottom: 60px;
    left: 8px;
    height: 24px;
    margin: 0;
    font-size: 9px;
    line-height: 24px;
    white-space: nowrap;
  }

  .mobile-screener > .mobile-bottom-nav {
    min-height: 60px;
    height: 60px;
    padding: 4px 5px;
  }

  .mobile-screener > .mobile-bottom-nav a {
    min-height: 52px;
    gap: 2px;
    font-size: 9px;
  }

  .mobile-screener > .mobile-bottom-nav .mobile-nav-icon {
    width: 21px;
    height: 21px;
  }
}

.mobile-flow-page {
  display: none;
}

@media (max-width: 767px) {
  :root {
    color-scheme: dark;
  }

  html,
  body {
    min-width: 0;
    width: 100%;
    height: auto !important;
    overflow-x: hidden;
    background: #07111e !important;
  }

  html {
    overflow-y: auto !important;
  }

  body {
    margin: 0;
    overflow-y: visible !important;
    color: #f3f7fb;
    font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
    font-variant-numeric: tabular-nums;
  }

  body > .app-shell {
    display: none !important;
  }

  .mobile-screener,
  .mobile-screener * {
    box-sizing: border-box;
  }

  .mobile-screener {
    --m-bg: #07111e;
    --m-card: #0d1b2a;
    --m-card-strong: #102238;
    --m-line: #21364c;
    --m-line-soft: rgba(69, 101, 130, 0.34);
    --m-primary: #36d7c0;
    --m-primary-strong: #08c9bd;
    --m-amber: #ffb020;
    --m-up: #ff5a67;
    --m-down: #30d48a;
    --m-muted: #91a3b8;
    --m-muted-2: #6f8399;
    display: block;
    min-height: 100dvh;
    padding: 24px 14px calc(112px + env(safe-area-inset-bottom));
    background:
      radial-gradient(circle at 48% -8%, rgba(28, 101, 144, 0.16), transparent 32%),
      var(--m-bg);
  }

  .mobile-screener button,
  .mobile-screener select,
  .mobile-screener a {
    font: inherit;
    -webkit-tap-highlight-color: transparent;
  }

  .mobile-screener button,
  .mobile-screener a,
  .mobile-screener select {
    min-height: 44px;
  }

  .mobile-screener-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 0 4px 13px;
  }

  .mobile-screener-head h1 {
    margin: 0;
    font-size: 25px;
    line-height: 1.25;
    letter-spacing: 0.02em;
    font-weight: 800;
  }

  .mobile-screener-head p {
    margin: 8px 0 0;
    color: var(--m-muted);
    font-size: 14px;
    line-height: 1.4;
  }

  .mobile-help-btn {
    display: grid;
    width: 44px;
    height: 44px;
    min-height: 44px;
    place-items: center;
    flex: 0 0 auto;
    border: 1px solid #7690a8;
    border-radius: 50%;
    background: rgba(13, 27, 42, 0.78);
    color: #b8c5d3;
    font-size: 25px;
    line-height: 1;
    cursor: pointer;
  }

  .mobile-snapshot-row {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.9fr);
    gap: 8px;
    align-items: center;
    padding: 0 0 10px;
  }

  .mobile-snapshot-row label {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    min-height: 48px;
    padding: 0 10px;
    border: 1px solid var(--m-line);
    border-radius: 8px;
    background: rgba(13, 27, 42, 0.84);
  }

  .mobile-snapshot-row label::after {
    content: "";
    position: absolute;
    right: 10px;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 6px solid #7890a8;
    pointer-events: none;
  }

  .mobile-snapshot-row label > span {
    color: #9fb0c2;
    font-size: 13px;
    white-space: nowrap;
  }

  .mobile-snapshot-row select {
    width: 100%;
    min-width: 0;
    padding: 0 18px 0 8px;
    border: 0;
    outline: 0;
    appearance: none;
    background: transparent;
    color: #b8c8d8;
    font-size: 14px;
    text-align: right;
    cursor: pointer;
  }

  .mobile-snapshot-row > small {
    grid-column: 1 / -1;
    justify-self: end;
    margin-top: -2px;
    padding-right: 3px;
    color: var(--m-muted);
    font-size: 12px;
  }

  .mobile-package-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 48px;
    margin: 0 0 8px;
    padding: 0 12px;
    border: 1px solid var(--m-line);
    border-radius: 8px;
    background: rgba(13, 27, 42, 0.76);
  }

  .mobile-package-copy {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 9px;
    color: var(--m-primary);
  }

  .mobile-package-copy i {
    width: 9px;
    height: 9px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: var(--m-primary);
    box-shadow: 0 0 12px rgba(54, 215, 192, 0.58);
  }

  .mobile-package-copy strong,
  .mobile-package-status > b {
    overflow: hidden;
    font-size: 14px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-package-status.is-pending .mobile-package-copy,
  .mobile-package-status.is-pending > b {
    color: var(--m-amber);
  }

  .mobile-package-status.is-pending .mobile-package-copy i {
    background: var(--m-amber);
    box-shadow: 0 0 12px rgba(255, 176, 32, 0.48);
  }

  .mobile-package-status.is-error .mobile-package-copy,
  .mobile-package-status.is-error > b {
    color: var(--m-up);
  }

  .mobile-current-strategy {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 76px;
    margin-bottom: 6px;
    padding: 10px 12px;
    border: 1px solid var(--m-line);
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(13, 27, 42, 0.96), rgba(10, 23, 37, 0.9));
  }

  .mobile-current-strategy-copy {
    min-width: 0;
  }

  .mobile-current-strategy-copy > span {
    display: block;
    color: var(--m-muted);
    font-size: 12px;
  }

  .mobile-current-strategy-copy strong {
    display: inline-block;
    max-width: 160px;
    margin-top: 5px;
    overflow: hidden;
    color: #f7f9fc;
    font-size: 17px;
    line-height: 1.25;
    text-overflow: ellipsis;
    vertical-align: middle;
    white-space: nowrap;
  }

  .mobile-current-strategy-copy em {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    margin: 5px 0 0 6px;
    padding: 0 7px;
    border: 1px solid rgba(54, 215, 192, 0.42);
    border-radius: 4px;
    color: var(--m-primary);
    font-size: 11px;
    font-style: normal;
    vertical-align: middle;
  }

  .mobile-strategy-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    flex: 0 0 146px;
    gap: 6px;
  }

  .mobile-strategy-links button,
  .mobile-strategy-links a {
    display: grid;
    min-width: 0;
    place-items: center;
    padding: 0 8px;
    border: 1px solid #70869c;
    border-radius: 6px;
    background: transparent;
    color: #a6b4c4;
    font-size: 13px;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
  }

  .mobile-strategy-links .active {
    border-color: var(--m-primary);
    background: rgba(14, 52, 61, 0.4);
    color: var(--m-primary);
  }

  .mobile-condition-tabs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 8px -14px 0;
    padding: 0 14px;
    border-bottom: 1px solid var(--m-line);
  }

  .mobile-condition-tabs button {
    position: relative;
    border: 0;
    background: transparent;
    color: var(--m-muted);
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
  }

  .mobile-condition-tabs button::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;
    height: 3px;
    border-radius: 3px 3px 0 0;
    background: transparent;
  }

  .mobile-condition-tabs button.active {
    color: #f2f7fb;
  }

  .mobile-condition-tabs button.active::after {
    background: var(--m-primary);
    box-shadow: 0 0 10px rgba(54, 215, 192, 0.35);
  }

  .mobile-condition-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: end;
    min-height: 82px;
    padding: 12px 0;
  }

  .mobile-condition-chips {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
    min-width: 0;
  }

  .mobile-condition-chips > span {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    max-width: 100%;
    padding: 0 11px;
    overflow: hidden;
    border: 1px solid var(--m-line);
    border-radius: 7px;
    background: rgba(13, 27, 42, 0.72);
    color: #a6b5c5;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-condition-chips > span.primary {
    border-color: var(--m-primary);
    color: var(--m-primary);
  }

  .mobile-edit-conditions {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 88px;
    padding: 0 10px;
    border: 1px solid #71869b;
    border-radius: 7px;
    color: #a8b5c4;
    font-size: 13px;
    text-decoration: none;
    white-space: nowrap;
  }

  .mobile-selection-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(104px, 1.2fr);
    gap: 6px;
    align-items: stretch;
    min-height: 82px;
    padding: 12px;
    border: 1px solid var(--m-line);
    border-radius: 8px;
    background: rgba(13, 27, 42, 0.82);
  }

  .mobile-selection-summary > div {
    min-width: 0;
    padding-top: 3px;
  }

  .mobile-selection-summary span {
    display: block;
    color: var(--m-muted);
    font-size: 12px;
  }

  .mobile-selection-summary strong {
    display: block;
    margin-top: 7px;
    overflow: visible;
    color: #f2f6fa;
    font-size: 18px;
    line-height: 1;
    letter-spacing: -0.03em;
    white-space: nowrap;
  }

  #mobileRunBtn {
    align-self: center;
    min-height: 52px;
    border: 1px solid #55ead9;
    border-radius: 6px;
    background: linear-gradient(135deg, #09bbae, #05cbbd);
    box-shadow: 0 8px 22px rgba(8, 201, 189, 0.19);
    color: #ecfffc;
    font-size: 17px;
    font-weight: 800;
    cursor: pointer;
  }

  #mobileRunBtn:disabled {
    border-color: #395469;
    background: #21364c;
    box-shadow: none;
    color: #8194a6;
    cursor: not-allowed;
  }

  .mobile-result-section {
    margin-top: 18px;
  }

  .mobile-result-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-height: 48px;
    padding: 0 3px;
  }

  .mobile-result-head h2 {
    margin: 0;
    font-size: 20px;
    line-height: 1.2;
  }

  .mobile-holdings-switch {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--m-muted);
    font-size: 13px;
    cursor: pointer;
  }

  .mobile-holdings-switch input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
  }

  .mobile-holdings-switch i {
    position: relative;
    width: 39px;
    height: 22px;
    border-radius: 999px;
    background: #64778c;
    transition: background 160ms ease;
  }

  .mobile-holdings-switch i::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: white;
    transition: transform 160ms ease;
  }

  .mobile-holdings-switch input:checked + i {
    background: var(--m-primary-strong);
  }

  .mobile-holdings-switch input:checked + i::after {
    transform: translateX(17px);
  }

  .mobile-holdings-switch input:disabled + i {
    opacity: 0.45;
  }

  .mobile-result-list {
    display: grid;
    gap: 0;
    border: 1px solid var(--m-line);
    border-radius: 8px;
    overflow: hidden;
    background: rgba(13, 27, 42, 0.45);
  }

  .mobile-result-empty {
    display: grid;
    min-height: 150px;
    place-content: center;
    gap: 8px;
    padding: 24px;
    color: var(--m-muted);
    text-align: center;
  }

  .mobile-result-empty strong {
    color: #c6d2de;
    font-size: 16px;
  }

  .mobile-result-empty span {
    font-size: 12px;
    line-height: 1.6;
  }

  .mobile-page-state {
    position: fixed;
    z-index: 120;
    top: calc(env(safe-area-inset-top, 0px) + 12px);
    right: 12px;
    left: 12px;
    max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 24px);
    overflow-y: auto;
    min-height: 150px;
    display: grid;
    grid-template-columns: 34px 48px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 16px 52px 16px 14px;
    border: 1px solid #2b587a;
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(9, 28, 48, 0.98), rgba(6, 20, 36, 0.98));
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.34);
  }

  .mobile-page-state[hidden] {
    display: none;
  }

  .mobile-page-state-close {
    position: absolute;
    z-index: 2;
    top: 9px;
    right: 9px;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid #355573;
    border-radius: 50%;
    background: rgba(8, 22, 36, 0.92);
    color: #d8e5f0;
    font: 400 24px/30px sans-serif;
  }

  .mobile-page-state-close[hidden] {
    display: none;
  }

  .mobile-page-state-index {
    align-self: start;
    display: grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border-radius: 7px;
    background: #0b3153;
    color: #2dc7ff;
    font-size: 16px;
  }

  .mobile-page-state-icon {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border: 2px solid #2caeff;
    border-radius: 50%;
    color: #39c8ff;
    font-size: 25px;
    font-weight: 800;
  }

  .mobile-page-state.is-loading .mobile-page-state-icon {
    border-top-color: transparent;
    animation: mobile-page-state-spin 900ms linear infinite;
  }

  .mobile-page-state.is-warning {
    border-color: rgba(255, 176, 32, 0.55);
  }

  .mobile-page-state.is-warning .mobile-page-state-icon {
    border-color: #ffb020;
    color: #ffb020;
  }

  .mobile-page-state.is-error {
    border-color: rgba(255, 90, 103, 0.58);
  }

  .mobile-page-state.is-error .mobile-page-state-icon {
    border-color: #ff5a67;
    color: #ff5a67;
  }

  .mobile-page-state.is-vip .mobile-page-state-icon {
    border-color: #6e71ff;
    color: #7f83ff;
  }

  .mobile-page-state-copy {
    min-width: 0;
  }

  .mobile-page-state-copy > strong {
    display: block;
    color: #f6f9fc;
    font-size: 16px;
    line-height: 1.25;
  }

  .mobile-page-state-copy > p {
    margin: 6px 0 0;
    color: #9db0c4;
    font-size: 11px;
    line-height: 1.5;
  }

  .mobile-page-state-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin-top: 11px;
  }

  .mobile-page-state-actions:has(button:only-child) {
    grid-template-columns: minmax(0, 1fr);
  }

  .mobile-page-state-actions button {
    min-height: 35px;
    padding: 0 8px;
    border: 1px solid #355573;
    border-radius: 6px;
    background: #10263e;
    color: #e8f1f8;
    font: inherit;
    font-size: 11px;
    font-weight: 700;
  }

  .mobile-page-state-actions button.primary {
    border-color: #28bcec;
    background: linear-gradient(135deg, #158edb, #16c5ee);
    color: white;
  }

  .mobile-page-state.is-warning .mobile-page-state-actions button.primary {
    border-color: #ffb020;
    background: linear-gradient(135deg, #e48312, #ff9f1c);
  }

  @keyframes mobile-page-state-spin {
    to { transform: rotate(360deg); }
  }

  .mobile-result-card {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 70px 58px;
    grid-template-areas:
      "identity price action"
      "metrics metrics action";
    column-gap: 6px;
    row-gap: 10px;
    min-height: 116px;
    align-items: center;
    padding: 12px 8px;
    border-bottom: 1px solid var(--m-line-soft);
    background: rgba(9, 24, 38, 0.62);
  }

  .mobile-result-card:last-child {
    border-bottom: 0;
  }

  .mobile-result-card.top-ranked {
    margin: 0;
    border: 1px solid rgba(255, 176, 32, 0.42);
    background: linear-gradient(100deg, rgba(63, 45, 18, 0.44), rgba(12, 27, 40, 0.9));
  }

  .mobile-rank-badge {
    position: absolute;
    top: 13px;
    left: 8px;
    display: grid;
    width: 38px;
    height: 40px;
    place-items: center;
    border: 1px solid rgba(255, 176, 32, 0.55);
    border-radius: 6px;
    background: rgba(72, 49, 16, 0.6);
    color: var(--m-amber);
    font-size: 10px;
    font-weight: 800;
  }

  .mobile-result-card.top-ranked .mobile-stock-identity {
    padding-left: 42px;
  }

  .mobile-stock-identity,
  .mobile-stock-price,
  .mobile-stock-metrics {
    min-width: 0;
  }

  .mobile-stock-identity {
    grid-area: identity;
  }

  .mobile-stock-price {
    grid-area: price;
  }

  .mobile-stock-identity a {
    display: block;
    min-height: 0;
    overflow: hidden;
    color: #f2f7fb;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.25;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-stock-identity span {
    display: block;
    margin-top: 7px;
    overflow: hidden;
    color: var(--m-muted);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-stock-price strong,
  .mobile-stock-price span {
    display: block;
    overflow: hidden;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-stock-price strong {
    color: #dbe5ed;
    font-size: 16px;
  }

  .mobile-stock-price strong.positive,
  .mobile-stock-price span.positive {
    color: var(--m-up);
  }

  .mobile-stock-price strong.negative,
  .mobile-stock-price span.negative {
    color: var(--m-down);
  }

  .mobile-stock-price span {
    margin-top: 9px;
    color: #f0f4f7;
    font-size: 14px;
  }

  .mobile-stock-metrics {
    grid-area: metrics;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
  }

  .mobile-stock-metrics div {
    min-width: 0;
  }

  .mobile-stock-metrics span,
  .mobile-stock-metrics strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-stock-metrics span {
    color: var(--m-muted);
    font-size: 11px;
  }

  .mobile-stock-metrics strong {
    margin-top: 8px;
    color: #e7edf2;
    font-size: 13px;
    font-weight: 500;
  }

  .mobile-add-holding {
    grid-area: action;
    align-self: center;
    min-width: 58px;
    padding: 0 5px;
    border: 1px solid rgba(255, 90, 103, 0.68);
    border-radius: 6px;
    background: rgba(72, 20, 28, 0.23);
    color: var(--m-up);
    font-size: 12px;
    cursor: pointer;
  }

  .mobile-add-holding.added,
  .mobile-add-holding:disabled {
    border-color: var(--m-line);
    background: rgba(33, 54, 76, 0.36);
    color: var(--m-muted);
    cursor: default;
  }

  .mobile-load-more {
    width: 100%;
    margin-top: 8px;
    border: 1px solid var(--m-line);
    border-radius: 7px;
    background: var(--m-card);
    color: #aab9c7;
    cursor: pointer;
  }

  .mobile-result-tools {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
    margin-top: 8px;
  }

  .mobile-result-tools button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 1px solid var(--m-line);
    border-radius: 7px;
    background: rgba(13, 27, 42, 0.7);
    color: #9cabb9;
    font-size: 13px;
    cursor: pointer;
  }

  .mobile-result-tools button:disabled {
    opacity: 0.42;
    cursor: not-allowed;
  }

  .mobile-result-tools button span {
    font-size: 17px;
  }

  .mobile-browser-boundary {
    margin: 12px 0 0;
    color: var(--m-muted);
    font-size: 12px;
    line-height: 1.5;
    text-align: center;
  }

  .mobile-bottom-nav {
    position: fixed;
    z-index: 80;
    right: 0;
    bottom: 0;
    left: 0;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    min-height: calc(62px + env(safe-area-inset-bottom));
    height: calc(62px + env(safe-area-inset-bottom));
    padding: 4px 5px env(safe-area-inset-bottom);
    border-top: 1px solid var(--m-line);
    background: rgba(8, 21, 34, 0.985);
    box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.24);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    will-change: transform;
  }

  .mobile-bottom-nav a {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    color: #8fa0b1;
    font-size: 11px;
    text-decoration: none;
  }

  .mobile-bottom-nav a.active {
    color: var(--m-primary);
  }

  .mobile-nav-icon {
    position: relative;
    display: block;
    width: 25px;
    height: 25px;
    min-height: 0;
    color: currentColor;
  }

  .mobile-nav-holdings {
    border: 2px solid currentColor;
    border-radius: 4px;
  }

  .mobile-nav-holdings::before {
    content: "";
    position: absolute;
    top: -7px;
    left: 6px;
    width: 9px;
    height: 7px;
    border: 2px solid currentColor;
    border-bottom: 0;
    border-radius: 4px 4px 0 0;
  }

  .mobile-nav-rank::before,
  .mobile-nav-rank::after {
    content: "";
    position: absolute;
    bottom: 1px;
    width: 5px;
    border-radius: 2px 2px 0 0;
    background: currentColor;
  }

  .mobile-nav-rank::before {
    left: 2px;
    height: 11px;
    box-shadow: 8px -8px currentColor, 16px -15px currentColor;
  }

  .mobile-nav-alerts {
    border: 2px solid currentColor;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    border-bottom: 0;
  }

  .mobile-nav-alerts::after {
    content: "";
    position: absolute;
    right: -3px;
    bottom: -2px;
    left: -3px;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
    box-shadow: 10px 4px 0 -4px currentColor;
  }

  .mobile-nav-screener {
    border: 2px solid currentColor;
    border-radius: 50%;
  }

  .mobile-nav-screener::before,
  .mobile-nav-screener::after {
    content: "";
    position: absolute;
    background: currentColor;
  }

  .mobile-nav-profile {
    border: 2px solid currentColor;
    border-radius: 50%;
    transform: scale(.56) translateY(-5px);
    transform-origin: 50% 30%;
  }

  .mobile-nav-profile::after {
    content: "";
    position: absolute;
    top: 27px;
    left: 50%;
    width: 32px;
    height: 20px;
    border: 3px solid currentColor;
    border-bottom: 0;
    border-radius: 20px 20px 0 0;
    transform: translateX(-50%);
  }

  .mobile-nav-screener::before {
    top: 4px;
    bottom: 4px;
    left: 10px;
    width: 2px;
  }

  .mobile-nav-screener::after {
    top: 10px;
    right: 4px;
    left: 4px;
    height: 2px;
  }

  body > dialog.work-dialog {
    width: min(94vw, 720px);
    max-width: min(94vw, 720px);
    max-height: 92dvh;
    margin: auto;
  }

  body > dialog.work-dialog::backdrop {
    background: rgba(2, 9, 16, 0.8);
    backdrop-filter: blur(3px);
  }

  body > .toast {
    z-index: 120;
  }

  .mobile-screener[hidden],
  .mobile-flow-page[hidden] {
    display: none !important;
  }
}

@media (max-width: 767px) {
  .mobile-flow-page,
  .mobile-flow-page * {
    box-sizing: border-box;
  }

  .mobile-flow-page:not([hidden]) {
    --m-bg: #07111e;
    --m-card: #0d1b2a;
    --m-card-strong: #102238;
    --m-line: #21364c;
    --m-line-soft: rgba(69, 101, 130, 0.34);
    --m-primary: #36d7c0;
    --m-primary-strong: #08c9bd;
    --m-amber: #ffb020;
    --m-up: #ff5a67;
    --m-down: #30d48a;
    --m-muted: #91a3b8;
    --m-muted-2: #6f8399;
    display: block;
    width: 100%;
    min-height: 100dvh;
    padding: 16px 10px 32px;
    overflow-x: hidden;
    background:
      radial-gradient(circle at 50% -6%, rgba(28, 101, 144, 0.18), transparent 30%),
      var(--m-bg);
    color: #f3f7fb;
  }

  .mobile-flow-page button,
  .mobile-flow-page select,
  .mobile-flow-page input {
    min-height: 44px;
    font: inherit;
    -webkit-tap-highlight-color: transparent;
  }

  .mobile-flow-head {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) auto;
    align-items: center;
    min-height: 54px;
    gap: 4px;
  }

  .mobile-flow-head h1 {
    margin: 0;
    overflow: hidden;
    font-size: 23px;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: 0.02em;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-flow-back,
  .mobile-flow-link {
    border: 0;
    background: transparent;
    cursor: pointer;
  }

  .mobile-flow-back {
    position: relative;
    display: grid;
    width: 44px;
    padding: 0;
    place-items: center;
    color: #f5f8fb;
    font-family: Arial, sans-serif !important;
    font-size: 0;
    font-weight: 200;
    line-height: 0.8;
  }

  .mobile-flow-back::before {
    content: "";
    width: 15px;
    height: 15px;
    border-bottom: 2px solid currentColor;
    border-left: 2px solid currentColor;
    transform: rotate(45deg);
  }

  .mobile-flow-link {
    padding: 0 3px 0 10px;
    color: var(--m-primary);
    font-size: 16px;
    white-space: nowrap;
  }

  /* M07 策略套用完成：数据全部来自当前已保存任务。 */
  .mobile-strategy-applied {
    padding: 10px 12px 24px;
  }

  .mobile-applied-head {
    position: relative;
    display: grid;
    min-height: 64px;
    place-items: center;
  }

  .mobile-applied-head > .mobile-flow-back {
    position: absolute;
    left: 0;
    top: 4px;
  }

  .mobile-applied-title {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .mobile-applied-title > span {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border: 2px solid var(--m-primary);
    border-radius: 50%;
    color: var(--m-primary);
    font-size: 24px;
    line-height: 1;
  }

  .mobile-applied-title h1 {
    margin: 0;
    font-size: 27px;
    line-height: 1.1;
    letter-spacing: 0.04em;
  }

  .mobile-applied-strategy-card,
  .mobile-applied-facts,
  .mobile-applied-snapshot,
  .mobile-applied-boundary {
    border: 1px solid var(--m-line);
    border-radius: 9px;
    background: linear-gradient(135deg, rgba(14, 33, 52, 0.96), rgba(7, 22, 36, 0.96));
  }

  .mobile-applied-strategy-card {
    padding: 12px 13px 10px;
  }

  .mobile-applied-strategy-card > header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 7px;
  }

  .mobile-applied-strategy-card h2 {
    margin: 0;
    overflow: hidden;
    font-size: 18px;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-applied-strategy-card em {
    padding: 3px 7px;
    border: 1px solid var(--m-up);
    border-radius: 5px;
    color: var(--m-up);
    font-size: 10px;
    font-style: normal;
  }

  .mobile-applied-strategy-card em.vip {
    border-color: var(--m-amber);
    color: var(--m-amber);
  }

  .mobile-applied-strategy-card > header > span {
    padding: 6px 8px;
    border: 1px solid rgba(54, 215, 192, 0.65);
    border-radius: 6px;
    color: var(--m-primary);
    font-size: 10px;
    white-space: nowrap;
  }

  .mobile-applied-strategy-card > button {
    min-height: 36px;
    margin-top: 5px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #bdc9d4;
    font-size: 13px;
    text-align: left;
  }

  .mobile-applied-strategy-card > button i {
    display: inline-grid;
    width: 20px;
    height: 20px;
    margin-right: 7px;
    place-items: center;
    border: 1px solid var(--m-primary);
    border-radius: 50%;
    color: var(--m-primary);
    font-size: 11px;
    font-style: normal;
  }

  .mobile-applied-local-note {
    margin: 8px 0;
    color: var(--m-muted);
    font-size: 11px;
    text-align: center;
  }

  .mobile-applied-facts {
    overflow: hidden;
  }

  .mobile-applied-facts > button {
    display: grid;
    grid-template-columns: 28px minmax(96px, 1fr) minmax(56px, auto) auto;
    width: 100%;
    min-height: 46px;
    align-items: center;
    gap: 7px;
    padding: 0 11px;
    border: 0;
    border-bottom: 1px solid var(--m-line-soft);
    background: transparent;
    color: #e9eef3;
    text-align: left;
  }

  .mobile-applied-facts > button:last-child {
    border-bottom: 0;
  }

  .mobile-applied-facts i {
    color: #b7c4d0;
    font-size: 20px;
    font-style: normal;
  }

  .mobile-applied-facts span,
  .mobile-applied-facts strong,
  .mobile-applied-facts em {
    font-size: 13px;
    font-style: normal;
    font-weight: 500;
  }

  .mobile-applied-facts em {
    color: var(--m-muted);
    white-space: nowrap;
  }

  .mobile-applied-snapshot {
    margin-top: 9px;
    padding: 9px 10px;
  }

  .mobile-applied-snapshot > div:first-child {
    display: grid;
    grid-template-columns: auto auto 1px auto auto minmax(0, 1fr);
    min-height: 30px;
    align-items: center;
    gap: 7px;
    color: var(--m-muted);
    font-size: 11px;
  }

  .mobile-applied-snapshot strong {
    color: #eef3f7;
    font-size: 12px;
  }

  .mobile-applied-snapshot i {
    width: 1px;
    height: 20px;
    background: var(--m-line);
  }

  .mobile-applied-snapshot small {
    overflow: hidden;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-applied-rule-chips {
    display: flex !important;
    min-height: 34px !important;
    align-items: center !important;
    gap: 5px !important;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .mobile-applied-rule-chips::-webkit-scrollbar {
    display: none;
  }

  .mobile-applied-rule-chips span {
    flex: 0 0 auto;
    padding: 5px 7px;
    border: 1px solid rgba(54, 215, 192, 0.6);
    border-radius: 5px;
    color: var(--m-primary);
    font-size: 10px;
    white-space: nowrap;
  }

  .mobile-applied-run {
    width: 100%;
    min-height: 48px !important;
    margin-top: 10px;
    border: 0;
    border-radius: 7px;
    background: linear-gradient(135deg, #08b9ae, #15cec0);
    color: #fff;
    font-size: 17px !important;
    font-weight: 800;
  }

  .mobile-applied-run:disabled {
    opacity: 0.5;
  }

  .mobile-applied-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 8px;
  }

  .mobile-applied-actions button {
    min-height: 44px;
    border: 1px solid var(--m-primary);
    border-radius: 7px;
    background: transparent;
    color: #f0f4f8;
    font-size: 14px;
  }

  .mobile-applied-backtest {
    display: grid;
    min-height: 38px;
    place-items: center;
    color: var(--m-primary);
    font-size: 13px;
    text-decoration: none;
  }

  .mobile-applied-boundary {
    margin: 4px 0 10px;
    padding: 10px 12px;
    color: #a9b8c6;
    font-size: 10px;
    line-height: 1.55;
    text-align: center;
  }

  .mobile-strategy-applied > .mobile-bottom-nav {
    margin-top: 0;
  }

  .mobile-flow-crumbs {
    display: flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    overflow: hidden;
    color: var(--m-muted);
    font-size: 13px;
  }

  .mobile-flow-crumbs button {
    min-height: 34px;
    max-width: 124px;
    padding: 0;
    overflow: hidden;
    border: 0;
    background: transparent;
    color: inherit;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
  }

  .mobile-flow-crumbs i {
    color: #60768b;
    font-size: 22px;
    font-style: normal;
  }

  .mobile-dirty-state {
    display: flex;
    min-height: 36px;
    margin: 0;
    align-items: center;
    justify-content: center;
    gap: 9px;
    color: var(--m-amber);
    font-size: 15px;
  }

  .mobile-dirty-state i {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--m-amber);
    box-shadow: 0 0 12px rgba(255, 176, 32, 0.45);
  }

  .mobile-dirty-state.saved {
    color: var(--m-primary);
  }

  .mobile-dirty-state.saved i {
    background: var(--m-primary);
    box-shadow: 0 0 12px rgba(54, 215, 192, 0.42);
  }

  .mobile-workspace-snapshot {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.95fr);
    gap: 8px;
    margin: 2px auto 8px;
    max-width: 330px;
  }

  .mobile-workspace-snapshot label {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    min-width: 0;
    align-items: center;
    padding: 0 9px;
    border: 1px solid var(--m-line);
    border-radius: 7px;
    background: rgba(13, 27, 42, 0.78);
    color: #a5b5c5;
  }

  .mobile-workspace-snapshot select {
    width: 100%;
    min-width: 0;
    padding: 0 2px 0 7px;
    border: 0;
    outline: 0;
    background: transparent;
    color: #b7c5d2;
    font-size: 13px;
  }

  .mobile-workspace-current {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    min-height: 50px;
    align-items: center;
    gap: 9px;
    margin: 0 auto 6px;
    max-width: 340px;
    padding: 0 9px;
    border: 1px solid var(--m-line);
    border-radius: 7px;
    background: rgba(13, 27, 42, 0.78);
  }

  .mobile-workspace-current span {
    color: #c5d0da;
    font-size: 13px;
  }

  .mobile-workspace-current strong {
    min-width: 0;
    overflow: hidden;
    font-size: 15px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-workspace-current button {
    padding: 0 9px;
    border: 1px solid var(--m-primary);
    border-radius: 6px;
    background: rgba(13, 70, 73, 0.28);
    color: var(--m-primary);
    font-size: 13px;
  }

  .mobile-workspace-section {
    scroll-margin-top: 8px;
    margin-top: 7px;
    padding: 10px;
    border: 1px solid var(--m-line);
    border-radius: 10px;
    background: linear-gradient(145deg, rgba(13, 27, 42, 0.92), rgba(8, 24, 38, 0.82));
  }

  .mobile-workspace-section > header {
    display: flex;
    min-height: 42px;
    align-items: center;
    gap: 10px;
  }

  .mobile-workspace-section > header > b {
    display: grid;
    width: 36px;
    height: 36px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 8px;
    background: rgba(0, 122, 130, 0.34);
    color: var(--m-primary);
    font-size: 17px;
  }

  .mobile-workspace-section h2 {
    min-width: 0;
    flex: 1;
    margin: 0;
    font-size: 18px;
    line-height: 1.2;
  }

  .mobile-workspace-section > header > select,
  .mobile-workspace-section > header > span {
    min-width: 0;
    max-width: 150px;
    padding: 0 8px;
    border: 1px solid var(--m-line);
    border-radius: 7px;
    background: rgba(6, 20, 33, 0.75);
    color: #c8d2dc;
    font-size: 12px;
  }

  .mobile-workspace-section > header > span {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
  }

  .mobile-scope-options {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
    margin-top: 8px;
  }

  .mobile-scope-options button {
    min-width: 0;
    padding: 0 4px;
    border: 1px solid #526a81;
    border-radius: 6px;
    background: transparent;
    color: #a5b4c3;
    font-size: 13px;
  }

  .mobile-scope-options button.active {
    border-color: var(--m-primary);
    background: rgba(10, 104, 107, 0.27);
    box-shadow: inset 0 0 18px rgba(54, 215, 192, 0.08);
    color: var(--m-primary);
  }

  .mobile-factor-tier {
    display: flex;
    min-height: 48px;
    align-items: center;
    gap: 9px;
    color: var(--m-muted);
    font-size: 13px;
  }

  .mobile-factor-tier-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 7px;
  }

  .mobile-factor-tier-row .mobile-factor-tier {
    min-width: 0;
  }

  .mobile-workspace-tool-link {
    min-height: 40px;
    margin-bottom: 4px;
    padding: 0 10px;
    border: 1px solid rgba(54, 215, 192, 0.68);
    border-radius: 6px;
    background: rgba(7, 62, 69, 0.35);
    color: var(--m-primary);
    font-size: 12px;
    white-space: nowrap;
  }

  .mobile-factor-tier select {
    min-height: 40px;
    padding: 0 28px 0 10px;
    border: 1px solid var(--m-line);
    border-radius: 6px;
    background: #091827;
    color: #d4dde5;
  }

  .mobile-workspace-rule-list {
    display: grid;
    gap: 7px;
  }

  .mobile-workspace-group {
    display: grid;
    min-width: 0;
    gap: 7px;
    padding: 7px;
    border: 1px solid rgba(54, 215, 192, 0.38);
    border-left-width: 3px;
    border-radius: 8px;
    background: rgba(6, 28, 40, 0.78);
  }

  .mobile-workspace-group[data-mobile-group-depth="2"],
  .mobile-workspace-group[data-mobile-group-depth="3"] {
    margin-left: 5px;
  }

  .mobile-workspace-group-head {
    display: flex;
    min-width: 0;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
  }

  .mobile-workspace-group-head > div:first-child {
    min-width: 72px;
    margin-right: auto;
  }

  .mobile-workspace-group-head strong,
  .mobile-workspace-group-head span {
    display: block;
  }

  .mobile-workspace-group-head strong {
    color: var(--m-primary);
    font-size: 12px;
  }

  .mobile-workspace-group-head span {
    margin-top: 2px;
    color: var(--m-muted);
    font-size: 9px;
  }

  .mobile-workspace-group-head > select {
    min-width: 112px;
    min-height: 34px;
    padding: 0 7px;
    border: 1px solid var(--m-line);
    border-radius: 6px;
    background: #091827;
    color: #dbe5ec;
    font-size: 10px;
  }

  .mobile-workspace-group-head > label {
    display: flex;
    min-height: 34px;
    align-items: center;
    gap: 4px;
    color: #b7c5d0;
    font-size: 10px;
  }

  .mobile-workspace-group-actions {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 5px;
  }

  .mobile-workspace-group-actions button {
    min-height: 32px;
    padding: 0 5px;
    border: 1px dashed rgba(54, 215, 192, 0.62);
    border-radius: 6px;
    background: transparent;
    color: var(--m-primary);
    font-size: 10px;
  }

  .mobile-workspace-group-actions button.danger {
    border-color: rgba(255, 92, 113, 0.55);
    color: var(--m-up);
  }

  .mobile-workspace-group-children {
    display: grid;
    min-width: 0;
    gap: 6px;
  }

  .mobile-workspace-group-children > .mobile-inline-rule-editor {
    border: 1px solid rgba(54, 215, 192, 0.72);
    border-radius: 8px;
    background: rgba(7, 29, 42, 0.96);
  }

  .mobile-workspace-rule {
    display: grid;
    grid-template-columns: 16px minmax(76px, 1fr) minmax(44px, auto) minmax(48px, 74px) 30px 30px;
    min-height: 72px;
    align-items: center;
    gap: 4px;
    padding: 8px 6px;
    border: 1px solid #2b4259;
    border-radius: 7px;
    background: rgba(8, 22, 35, 0.75);
  }

  .mobile-rule-grip {
    color: #7790a5;
    font-size: 19px;
  }

  .mobile-workspace-rule > div {
    min-width: 0;
  }

  .mobile-workspace-rule strong,
  .mobile-workspace-rule small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-workspace-rule strong {
    font-size: 14px;
  }

  .mobile-workspace-rule small {
    margin-top: 6px;
    color: var(--m-muted);
    font-size: 10px;
  }

  .mobile-workspace-rule > span:not(.mobile-rule-grip) {
    overflow: hidden;
    color: #a6b4c2;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-workspace-rule > em {
    display: none;
  }

  .mobile-workspace-rule > b {
    overflow: hidden;
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-workspace-rule > button {
    display: grid;
    min-width: 28px;
    min-height: 38px;
    padding: 0;
    place-items: center;
    border: 0;
    background: transparent;
    color: #aebbc8;
    font-size: 20px;
  }

  .mobile-workspace-rule > button.danger {
    color: var(--m-up);
  }

  .mobile-workspace-rule.editing {
    border-color: rgba(54, 215, 192, 0.76);
    background: rgba(8, 31, 43, 0.92);
    box-shadow: 0 0 0 1px rgba(54, 215, 192, 0.12);
  }

  .mobile-inline-rule-editor {
    display: grid;
    grid-column: 1 / -1;
    min-width: 0;
    gap: 8px;
    margin-top: 4px;
    padding: 11px;
    border-top: 1px solid rgba(54, 215, 192, 0.32);
    background: rgba(5, 20, 32, 0.74);
  }

  .mobile-workspace-rule-list > .mobile-inline-rule-editor {
    margin-top: 0;
    border: 1px solid rgba(54, 215, 192, 0.72);
    border-radius: 8px;
    background: rgba(7, 29, 42, 0.96);
  }

  .mobile-inline-rule-editor > header,
  .mobile-inline-factor-fixed,
  .mobile-inline-factor-select,
  .mobile-inline-rule-target {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 8px;
  }

  .mobile-inline-rule-editor > header {
    justify-content: space-between;
  }

  .mobile-inline-rule-editor > header strong {
    color: #f2f7fa;
    font-size: 14px;
  }

  .mobile-inline-rule-editor > header span,
  .mobile-inline-factor-fixed > span,
  .mobile-inline-factor-select > span,
  .mobile-inline-rule-target > span {
    flex: 0 0 auto;
    color: var(--m-muted);
    font-size: 10px;
  }

  .mobile-inline-factor-fixed {
    min-height: 42px;
    padding: 0 9px;
    border: 1px solid var(--m-line);
    border-radius: 6px;
    background: #091827;
  }

  .mobile-inline-factor-fixed strong {
    min-width: 0;
    overflow: hidden;
    color: var(--m-primary);
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-inline-factor-fixed em {
    margin-left: auto;
    color: #91a5b7;
    font-size: 9px;
    font-style: normal;
    white-space: nowrap;
  }

  .mobile-inline-factor-select,
  .mobile-inline-rule-target {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
  }

  .mobile-inline-factor-select select,
  .mobile-inline-rule-target select,
  .mobile-inline-rule-controls > select {
    width: 100%;
    min-width: 0;
    min-height: 42px;
    padding: 0 8px;
    border: 1px solid var(--m-line);
    border-radius: 6px;
    outline: 0;
    background: #091827;
    color: #dbe5ec;
  }

  .mobile-inline-factor-help {
    padding: 8px 9px;
    border: 1px solid var(--m-line-soft);
    border-radius: 6px;
    background: rgba(13, 32, 48, 0.7);
  }

  .mobile-inline-factor-help > p {
    margin: 0;
    color: #c4d1db;
    font-size: 11px;
    line-height: 1.5;
  }

  .mobile-inline-factor-help dl {
    display: grid;
    gap: 5px;
    margin: 7px 0 0;
  }

  .mobile-inline-factor-help dl div {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 6px;
  }

  .mobile-inline-factor-help dt,
  .mobile-inline-factor-help dd {
    margin: 0;
    font-size: 9px;
    line-height: 1.45;
  }

  .mobile-inline-factor-help dt {
    color: var(--m-primary);
  }

  .mobile-inline-factor-help dd {
    overflow-wrap: anywhere;
    color: var(--m-muted);
  }

  .mobile-inline-rule-controls {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.25fr);
    gap: 7px;
  }

  .mobile-inline-rule-controls .mobile-rule-number {
    min-height: 42px;
  }

  .mobile-inline-rule-sentence {
    margin: 0;
    padding: 8px;
    border-left: 2px solid #65b4d3;
    background: rgba(29, 81, 105, 0.16);
    color: #b3c8d8;
    font-size: 10px;
    line-height: 1.4;
  }

  .mobile-inline-rule-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
  }

  .mobile-inline-rule-actions button {
    min-height: 44px;
    border: 1px solid var(--m-primary);
    border-radius: 6px;
    background: transparent;
    color: var(--m-primary);
    font-size: 13px;
    font-weight: 700;
  }

  .mobile-inline-rule-actions button:last-child {
    background: linear-gradient(135deg, #08b8ad, #13cfc0);
    color: #06222a;
  }

  .mobile-workspace-empty {
    display: grid;
    min-height: 72px;
    place-items: center;
    padding: 12px;
    color: var(--m-muted);
    font-size: 13px;
    text-align: center;
  }

  .mobile-workspace-add-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin-top: 8px;
  }

  .mobile-workspace-add-row button,
  .mobile-workspace-inline-add {
    border: 1px dashed var(--m-primary);
    border-radius: 7px;
    background: transparent;
    color: var(--m-primary);
    font-size: 13px;
  }

  .mobile-workspace-inline-add {
    width: 100%;
    margin-top: 8px;
  }

  .mobile-workspace-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 8px;
  }

  .mobile-workspace-chips > span {
    display: inline-flex;
    min-height: 40px;
    align-items: stretch;
    border: 1px solid #526b82;
    border-radius: 6px;
    overflow: hidden;
  }

  .mobile-workspace-chips > span.empty {
    align-items: center;
    padding: 0 12px;
    color: var(--m-muted);
  }

  .mobile-workspace-chips button {
    min-height: 38px;
    padding: 0 10px;
    border: 0;
    background: transparent;
    color: #aebac6;
    font-size: 12px;
  }

  .mobile-workspace-chips button + button {
    padding: 0 7px;
    color: var(--m-up);
  }

  .mobile-workspace-sort-list {
    display: grid;
    gap: 6px;
    margin-top: 8px;
  }

  .mobile-workspace-sort-list article {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto 40px;
    min-height: 46px;
    align-items: center;
    gap: 7px;
    padding: 0 5px;
    border-top: 1px solid var(--m-line-soft);
  }

  .mobile-workspace-sort-list article > b {
    color: var(--m-amber);
    text-align: center;
  }

  .mobile-workspace-sort-list article > select {
    min-height: 38px;
    padding: 0 7px;
    border: 0;
    background: transparent;
    color: var(--m-muted);
    font-size: 12px;
  }

  .mobile-workspace-sort-list article > button:not(.mobile-workspace-sort-factor) {
    border: 0;
    background: transparent;
    color: var(--m-up);
    font-size: 19px;
  }

  .mobile-workspace-sort-factor {
    min-width: 0;
    min-height: 38px;
    padding: 0;
    overflow: hidden;
    border: 0;
    background: transparent;
    color: #dce5ec;
    font-size: 13px;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-advanced-summary > header label {
    display: flex;
    align-items: center;
    gap: 7px;
    color: var(--m-muted);
    font-size: 12px;
  }

  .mobile-advanced-summary input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
  }

  .mobile-advanced-summary label i {
    position: relative;
    width: 38px;
    height: 22px;
    border-radius: 999px;
    background: #65778a;
  }

  .mobile-advanced-summary label i::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: white;
    transition: transform 150ms ease;
  }

  .mobile-advanced-summary input:checked + i {
    background: var(--m-primary-strong);
  }

  .mobile-advanced-summary input:checked + i::after {
    transform: translateX(16px);
  }

  .mobile-advanced-summary > div {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 5px 0 0 46px;
  }

  .mobile-advanced-summary > div p {
    min-width: 0;
    margin: 0;
    color: var(--m-muted);
    font-size: 12px;
  }

  .mobile-advanced-summary .mobile-workspace-tool-link {
    min-height: 34px;
    margin: 0;
    flex: 0 0 auto;
  }

  .mobile-workspace-actions {
    margin-top: 8px;
    padding: 9px;
    border: 1px solid rgba(54, 215, 192, 0.55);
    border-radius: 9px;
    background: rgba(6, 45, 54, 0.55);
  }

  .mobile-workspace-summary {
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .mobile-workspace-summary > span {
    color: white;
    font-size: 28px;
  }

  .mobile-workspace-summary p {
    min-width: 0;
    margin: 0;
  }

  .mobile-workspace-summary strong,
  .mobile-workspace-summary small {
    display: block;
  }

  .mobile-workspace-summary strong {
    color: var(--m-primary);
    font-size: 14px;
  }

  .mobile-workspace-summary small {
    margin-top: 5px;
    color: #9db0c0;
    font-size: 10px;
  }

  .mobile-workspace-actions > div:last-child {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin-top: 9px;
  }

  .mobile-workspace-actions button {
    border: 1px solid var(--m-primary);
    border-radius: 7px;
    background: transparent;
    color: var(--m-primary);
    font-size: 15px;
  }

  .mobile-workspace-actions button:last-child {
    background: linear-gradient(135deg, #08b9ae, #17d0c2);
    color: #05222a;
    font-weight: 800;
  }

  .mobile-workspace-boundary {
    margin: 7px 8px 0;
    color: var(--m-muted);
    font-size: 11px;
    line-height: 1.55;
    text-align: center;
  }

  /* M09 因子与单条件编辑 */
  .mobile-rule-editor {
    padding-bottom: 26px !important;
  }

  .mobile-rule-steps {
    display: flex;
    min-height: 64px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: var(--m-muted);
    font-size: 14px;
  }

  .mobile-rule-steps span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
  }

  .mobile-rule-steps b {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border: 1px solid #91a2b2;
    border-radius: 50%;
  }

  .mobile-rule-steps i {
    width: 54px;
    height: 1px;
    background: #637689;
  }

  .mobile-rule-steps .active {
    color: var(--m-primary);
  }

  .mobile-rule-steps .active b {
    border-color: var(--m-primary);
    background: var(--m-primary);
    color: #06202a;
  }

  .mobile-rule-tier-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
  }

  .mobile-rule-tier-tabs button {
    border: 1px solid var(--m-line);
    border-radius: 7px;
    background: rgba(13, 27, 42, 0.7);
    color: #a5b3c1;
    font-size: 14px;
  }

  .mobile-rule-tier-tabs button.active {
    border-color: var(--m-primary);
    color: var(--m-primary);
  }

  .mobile-rule-search,
  .mobile-strategy-search {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    min-height: 52px;
    align-items: center;
    margin-top: 9px;
    padding: 0 10px;
    border: 1px solid var(--m-line);
    border-radius: 7px;
    background: rgba(13, 27, 42, 0.75);
    color: var(--m-muted);
  }

  .mobile-rule-search > span,
  .mobile-strategy-search > span {
    font-size: 28px;
    line-height: 1;
  }

  .mobile-rule-search input,
  .mobile-strategy-search input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: #e8edf2;
    font-size: 13px;
  }

  .mobile-rule-groups {
    display: flex;
    gap: 7px;
    margin: 8px 0;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .mobile-rule-groups::-webkit-scrollbar {
    display: none;
  }

  .mobile-rule-groups button {
    min-height: 40px;
    flex: 0 0 auto;
    padding: 0 12px;
    border: 1px solid var(--m-line);
    border-radius: 6px;
    background: rgba(13, 27, 42, 0.68);
    color: var(--m-muted);
    font-size: 12px;
  }

  .mobile-rule-groups button.active {
    border-color: var(--m-primary);
    background: rgba(19, 108, 109, 0.48);
    color: white;
  }

  .mobile-rule-factor-list {
    max-height: 242px;
    overflow-y: auto;
    border: 1px solid var(--m-line);
    border-radius: 8px;
    background: rgba(13, 27, 42, 0.52);
  }

  .mobile-rule-factor-list > button {
    display: grid;
    grid-template-columns: 24px minmax(105px, 0.8fr) minmax(0, 1.25fr);
    width: 100%;
    min-height: 48px;
    align-items: center;
    gap: 7px;
    padding: 0 10px;
    border: 0;
    border-bottom: 1px solid var(--m-line-soft);
    background: transparent;
    color: #edf2f6;
    text-align: left;
  }

  .mobile-rule-factor-list > button:last-child {
    border-bottom: 0;
  }

  .mobile-rule-factor-list > button i {
    width: 17px;
    height: 17px;
    border: 1px solid #8a9cac;
    border-radius: 50%;
  }

  .mobile-rule-factor-list > button.active i {
    border: 5px solid var(--m-primary);
  }

  .mobile-rule-factor-list > button span {
    overflow: hidden;
    color: var(--m-muted);
    font-size: 10px;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-rule-detail {
    margin-top: 9px;
    overflow: hidden;
    border: 1px solid var(--m-line);
    border-radius: 8px;
    background: rgba(13, 27, 42, 0.82);
  }

  .mobile-rule-detail > header {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 7px;
    padding: 11px;
  }

  .mobile-rule-detail > header > span {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 6px;
    background: rgba(23, 104, 134, 0.38);
    color: #6fe4f2;
  }

  .mobile-rule-detail > header em {
    padding: 4px 6px;
    border-radius: 5px;
    background: rgba(0, 117, 122, 0.34);
    color: var(--m-primary);
    font-size: 10px;
    font-style: normal;
  }

  .mobile-rule-detail > header b {
    color: var(--m-muted);
    font-size: 10px;
    font-weight: 500;
  }

  .mobile-rule-detail dl {
    display: grid;
    gap: 9px;
    margin: 0;
    padding: 0 11px 10px;
  }

  .mobile-rule-detail dl div {
    display: grid;
    gap: 4px;
  }

  .mobile-rule-detail dt {
    color: var(--m-muted);
    font-size: 11px;
  }

  .mobile-rule-detail dd {
    margin: 0;
    color: #c7d2dc;
    font-size: 12px;
    line-height: 1.55;
  }

  .mobile-rule-detail > div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-top: 1px solid var(--m-line-soft);
  }

  .mobile-rule-detail > div button {
    border: 0;
    background: transparent;
    color: var(--m-primary);
    font-size: 12px;
  }

  .mobile-rule-detail > div button + button {
    border-left: 1px solid var(--m-line-soft);
  }

  .mobile-rule-detail > p {
    margin: 0;
    padding: 9px 11px;
    border-top: 1px solid var(--m-line-soft);
    color: #aebbc7;
    font-size: 11px;
    line-height: 1.45;
  }

  .mobile-rule-setup {
    margin-top: 9px;
    padding: 11px;
    border: 1px solid var(--m-line);
    border-radius: 8px;
    background: rgba(13, 27, 42, 0.78);
  }

  .mobile-rule-setup h2 {
    margin: 0 0 9px;
    font-size: 17px;
  }

  #mobileRuleControls {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.4fr);
    gap: 7px;
  }

  #mobileRuleControls > select,
  .mobile-rule-number {
    min-width: 0;
    border: 1px solid var(--m-line);
    border-radius: 6px;
    background: #091827;
    color: #e0e7ed;
  }

  #mobileRuleControls > select {
    width: 100%;
    padding: 0 9px;
  }

  .mobile-rule-number {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    padding: 0 9px;
  }

  .mobile-rule-number input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: white;
  }

  .mobile-rule-number span {
    color: var(--m-amber);
    font-size: 12px;
  }

  .mobile-rule-no-value {
    display: grid;
    min-height: 44px;
    place-items: center;
    color: var(--m-muted);
    font-size: 12px;
  }

  .mobile-rule-setup > p {
    margin: 8px 0 0;
    padding: 8px;
    border-left: 2px solid #65b4d3;
    background: rgba(29, 81, 105, 0.16);
    color: #a9bfd0;
    font-size: 11px;
  }

  .mobile-rule-target {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    min-height: 62px;
    align-items: center;
    gap: 10px;
    margin-top: 9px;
    padding: 0 11px;
    border: 1px solid var(--m-line);
    border-radius: 8px;
    background: rgba(13, 27, 42, 0.75);
  }

  .mobile-rule-target span {
    white-space: nowrap;
  }

  .mobile-rule-target small {
    color: var(--m-muted);
  }

  .mobile-rule-target select {
    width: 100%;
    min-width: 0;
    padding: 0 8px;
    border: 1px solid var(--m-line);
    border-radius: 6px;
    background: #091827;
    color: #dae3ea;
  }

  .mobile-rule-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin-top: 9px;
  }

  .mobile-rule-actions button {
    min-height: 54px;
    border: 1px solid var(--m-primary);
    border-radius: 7px;
    background: transparent;
    color: var(--m-primary);
    font-size: 16px;
    font-weight: 700;
  }

  .mobile-rule-actions button:last-child {
    background: linear-gradient(135deg, #08b8ad, #13cfc0);
    color: #06222a;
  }

  .mobile-rule-actions button:disabled {
    border-color: var(--m-line);
    background: #172b3e;
    color: var(--m-muted);
  }

  /* M10 我的策略 */
  .mobile-my-strategies {
    padding: 16px 12px calc(104px + env(safe-area-inset-bottom)) !important;
  }

  .mobile-strategy-head {
    grid-template-columns: 48px minmax(0, 1fr) auto;
    align-items: start;
  }

  .mobile-strategy-head h1 {
    margin-top: 8px;
    text-align: left;
  }

  .mobile-strategy-head p {
    margin: 5px 0 0;
    color: var(--m-muted);
    font-size: 11px;
  }

  .mobile-outline-action {
    min-height: 44px;
    margin-top: 6px;
    padding: 0 10px;
    border: 1px solid var(--m-primary);
    border-radius: 6px;
    background: transparent;
    color: var(--m-primary);
    font-size: 12px;
  }

  .mobile-strategy-card-list {
    display: grid;
    gap: 8px;
    margin-top: 9px;
  }

  .mobile-strategy-card {
    padding: 8px;
    border: 1px solid var(--m-line);
    border-radius: 9px;
    background: linear-gradient(145deg, rgba(13, 27, 42, 0.94), rgba(8, 24, 38, 0.84));
  }

  .mobile-strategy-card.current {
    border-color: var(--m-primary);
    box-shadow: inset 0 0 24px rgba(54, 215, 192, 0.04);
  }

  .mobile-strategy-card > header {
    display: flex;
    min-height: 28px;
    align-items: center;
    gap: 8px;
  }

  .mobile-strategy-card > header > span {
    display: grid;
    width: 24px;
    height: 24px;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid transparent;
    border-radius: 50%;
    color: var(--m-primary);
  }

  .mobile-strategy-card.current > header > span {
    border-color: var(--m-primary);
  }

  .mobile-strategy-card h2 {
    min-width: 0;
    flex: 1;
    margin: 0;
    overflow: hidden;
    font-size: 15px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-strategy-card header em,
  .mobile-strategy-card header b {
    flex: 0 0 auto;
    padding: 4px 7px;
    border: 1px solid var(--m-line);
    border-radius: 5px;
    color: var(--m-muted);
    font-size: 10px;
    font-style: normal;
    font-weight: 500;
  }

  .mobile-strategy-card header em.free {
    border-color: rgba(255, 90, 103, 0.5);
    color: var(--m-up);
  }

  .mobile-strategy-card header em.vip {
    border-color: rgba(255, 176, 32, 0.52);
    color: var(--m-amber);
  }

  .mobile-strategy-card header b {
    border-color: rgba(54, 215, 192, 0.5);
    color: var(--m-primary);
  }

  .mobile-strategy-facts {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 5px;
  }

  .mobile-strategy-facts span {
    min-height: 24px;
    padding: 4px 7px;
    border: 1px solid #496178;
    border-radius: 5px;
    color: #a8b7c5;
    font-size: 10px;
  }

  .mobile-strategy-card > footer {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 8px;
    margin-top: 5px;
  }

  .mobile-strategy-card > footer small {
    color: var(--m-muted);
    font-size: 9px;
    white-space: nowrap;
  }

  .mobile-strategy-card > footer > div {
    display: flex;
    align-items: center;
  }

  .mobile-strategy-card > footer button {
    min-height: 30px !important;
    padding: 0 7px;
    border: 0;
    border-left: 1px solid var(--m-line-soft);
    background: transparent;
    color: #d3dce4;
    font-size: 11px;
  }

  .mobile-strategy-card > footer button:first-child {
    border-left: 0;
  }

  .mobile-strategy-card > footer button:disabled {
    color: var(--m-primary);
    opacity: 0.8;
  }

  .mobile-strategy-card > footer button:last-child {
    color: #b9c4ce;
  }

  .mobile-strategy-card > footer .notification-subscription-btn {
    color: #9fd9ff;
  }

  .mobile-strategy-card > footer .notification-subscription-btn.is-active {
    color: var(--m-primary);
  }

  .mobile-strategy-transfer {
    margin-top: 8px;
    padding: 8px;
    border: 1px solid var(--m-line);
    border-radius: 9px;
    background: rgba(13, 27, 42, 0.78);
  }

  .mobile-strategy-transfer header {
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .mobile-strategy-transfer header > span {
    color: #b4c1cc;
    font-size: 27px;
  }

  .mobile-strategy-transfer h2,
  .mobile-strategy-transfer p {
    margin: 0;
  }

  .mobile-strategy-transfer h2 {
    font-size: 16px;
  }

  .mobile-strategy-transfer p {
    margin-top: 4px;
    color: var(--m-muted);
    font-size: 10px;
  }

  .mobile-strategy-transfer > div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin-top: 7px;
  }

  .mobile-strategy-transfer button {
    min-height: 40px;
    padding: 0 6px;
    border: 1px solid var(--m-primary);
    border-radius: 6px;
    background: transparent;
    color: var(--m-primary);
    font-size: 12px;
  }

  .mobile-strategy-transfer button:disabled,
  .mobile-strategy-card button:disabled {
    border-color: var(--m-line);
    color: var(--m-muted);
    opacity: .55;
  }

  .mobile-strategy-warning {
    margin: 8px 0;
    padding: 7px;
    border: 1px solid rgba(255, 176, 32, 0.38);
    border-radius: 7px;
    background: rgba(70, 48, 16, 0.18);
    color: var(--m-amber);
    font-size: 10px;
    line-height: 1.5;
  }

  .mobile-strategy-return {
    width: 100%;
    min-height: 48px !important;
    border: 0;
    border-radius: 7px;
    background: linear-gradient(135deg, #08b9ae, #15cec0);
    color: white;
    font-size: 17px;
    font-weight: 800;
  }

  .mobile-strategy-more {
    width: 100%;
    border: 1px dashed var(--m-primary);
    border-radius: 7px;
    background: transparent;
    color: var(--m-primary);
    font-size: 12px;
  }

  body > dialog.mobile-unsaved-task-dialog {
    width: min(90vw, 420px);
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 176, 32, 0.48);
    border-radius: 12px;
    background: #0d1b2a;
    color: #eef3f7;
  }

  .mobile-unsaved-task-head {
    display: flex;
    gap: 12px;
    padding: 18px;
  }

  .mobile-unsaved-task-head > span {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid var(--m-amber, #ffb020);
    border-radius: 50%;
    color: #ffb020;
    font-size: 22px;
  }

  .mobile-unsaved-task-head h2 {
    margin: 0;
    font-size: 18px;
  }

  .mobile-unsaved-task-head p {
    margin: 8px 0 0;
    color: #91a3b8;
    font-size: 12px;
    line-height: 1.55;
  }
}

@media (max-width: 350px) {
  .mobile-current-strategy {
    align-items: stretch;
    flex-direction: column;
  }

  .mobile-strategy-links {
    width: 100%;
    flex-basis: auto;
  }

  .mobile-selection-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  #mobileRunBtn {
    grid-column: 1 / -1;
  }

  .mobile-result-card {
    grid-template-columns: minmax(0, 1fr) 62px;
    grid-template-areas:
      "identity price"
      "metrics metrics"
      "action action";
  }

  .mobile-add-holding {
    grid-area: action;
    justify-self: end;
    min-height: 38px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mobile-screener *,
  .mobile-screener *::before,
  .mobile-screener *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}

@media (max-width: 767px) {
  /* M11—M16 share the approved compact mobile tool language. */
  .mobile-tool-head > div {
    min-width: 0;
    text-align: center;
  }

  .mobile-tool-head > div h1 {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-tool-head > div p {
    margin: 4px 0 0;
    color: var(--m-muted);
    font-size: 12px;
  }

  .mobile-verified-badge {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    gap: 5px;
    padding: 0 8px;
    border: 1px solid rgba(54, 215, 192, 0.45);
    border-radius: 8px;
    color: var(--m-primary);
    font-size: 11px;
    white-space: nowrap;
  }

  .mobile-verified-badge i {
    display: grid;
    width: 19px;
    height: 19px;
    place-items: center;
    border-radius: 50%;
    background: var(--m-primary);
    color: #05212a;
    font-style: normal;
    font-weight: 900;
  }

  .mobile-tool-filters {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 116px;
    gap: 8px;
    margin-top: 8px;
  }

  .mobile-tool-search {
    display: grid;
    grid-template-columns: 31px minmax(0, 1fr);
    min-height: 48px;
    align-items: center;
    padding: 0 10px;
    border: 1px solid var(--m-line);
    border-radius: 8px;
    background: rgba(13, 27, 42, 0.76);
    color: var(--m-muted);
  }

  .mobile-tool-search > span {
    font-size: 28px;
    line-height: 1;
  }

  .mobile-tool-search input,
  .mobile-tool-filters select {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: #e8eef4;
    font-size: 13px;
  }

  .mobile-tool-filters > select {
    min-height: 48px;
    padding: 0 24px 0 9px;
    border: 1px solid var(--m-line);
    border-radius: 8px;
    background: #0b1a29;
  }

  .mobile-tool-more {
    width: 100%;
    min-height: 42px !important;
    border: 1px solid var(--m-line);
    border-radius: 7px;
    background: rgba(7, 23, 37, 0.7);
    color: var(--m-primary);
    font-size: 13px;
  }

  .mobile-tool-boundary {
    margin: 10px 8px 0;
    color: var(--m-muted);
    font-size: 11px;
    line-height: 1.5;
    text-align: center;
  }

  .mobile-tool-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 9px;
  }

  .mobile-tool-actions button {
    min-height: 48px;
    border: 1px solid var(--m-primary);
    border-radius: 8px;
    background: transparent;
    color: #e9eff4;
    font-size: 16px;
    font-weight: 700;
  }

  .mobile-tool-actions button:last-child {
    background: linear-gradient(135deg, #07b9af, #1ad4c4);
    color: #03252b;
  }

  /* M11 因子目录 */
  .mobile-factor-catalog {
    padding-bottom: 20px !important;
  }

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

  .mobile-catalog-stats article {
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr);
    grid-template-rows: 27px 20px;
    min-height: 70px;
    align-content: center;
    align-items: center;
    padding: 7px 8px;
    border: 1px solid var(--m-line);
    border-radius: 9px;
    background: linear-gradient(145deg, rgba(13, 27, 42, 0.95), rgba(7, 25, 40, 0.82));
  }

  .mobile-catalog-stats article > span {
    grid-row: 1 / 3;
    color: var(--m-primary);
    font-size: 22px;
  }

  .mobile-catalog-stats strong {
    color: var(--m-primary);
    font-size: 20px;
    font-variant-numeric: tabular-nums;
  }

  .mobile-catalog-stats small {
    color: #c5d0da;
    font-size: 10px;
  }

  .mobile-catalog-list {
    margin-top: 8px;
    overflow: hidden;
    border: 1px solid var(--m-line);
    border-radius: 9px;
    background: rgba(8, 23, 37, 0.84);
  }

  .mobile-catalog-list > header,
  .mobile-catalog-row > button {
    display: grid;
    grid-template-columns: minmax(0, 1.8fr) minmax(58px, 0.8fr) 42px 58px;
    align-items: center;
    gap: 5px;
  }

  .mobile-catalog-list > header {
    min-height: 38px;
    padding: 0 9px;
    border-bottom: 1px solid var(--m-line);
    color: var(--m-muted);
    font-size: 10px;
  }

  .mobile-catalog-row {
    border-bottom: 1px solid rgba(70, 99, 124, 0.34);
  }

  .mobile-catalog-row:last-of-type {
    border-bottom: 0;
  }

  .mobile-catalog-row > button {
    width: 100%;
    min-height: 54px;
    padding: 6px 9px;
    border: 0;
    background: transparent;
    color: #e8eef4;
    text-align: left;
  }

  .mobile-catalog-row > button > strong,
  .mobile-catalog-row > button > span,
  .mobile-catalog-row > button > em {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-catalog-row > button > strong {
    font-size: 14px;
  }

  .mobile-catalog-row > button > strong code {
    display: block;
    margin-top: 3px;
    color: var(--m-muted);
    font-family: inherit;
    font-size: 10px;
    font-weight: 400;
  }

  .mobile-catalog-row > button > span,
  .mobile-catalog-row > button > em {
    color: #a8b6c3;
    font-size: 10px;
    font-style: normal;
  }

  .mobile-catalog-row > button > em.good {
    color: var(--m-primary);
  }

  .mobile-catalog-row > button > em.warn {
    color: var(--m-amber);
  }

  .mobile-catalog-row.active {
    box-shadow: inset 2px 0 0 var(--m-primary);
  }

  .mobile-catalog-detail {
    padding: 9px 10px 11px;
    border-top: 1px solid rgba(60, 97, 126, 0.34);
    background: rgba(9, 27, 43, 0.88);
  }

  .mobile-catalog-detail dl {
    display: grid;
    gap: 7px;
    margin: 0;
  }

  .mobile-catalog-detail dl > div {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 8px;
    color: #d4dde5;
    font-size: 11px;
    line-height: 1.5;
  }

  .mobile-catalog-detail dt {
    color: var(--m-muted);
  }

  .mobile-catalog-detail dd {
    margin: 0;
  }

  .mobile-catalog-detail-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    margin-top: 9px;
  }

  .mobile-catalog-detail-actions button {
    min-height: 40px;
    padding: 0 4px;
    border: 1px solid rgba(54, 215, 192, 0.55);
    border-radius: 7px;
    background: transparent;
    color: var(--m-primary);
    font-size: 11px;
  }

  .mobile-catalog-example {
    display: grid;
    gap: 4px;
    margin-top: 8px;
    padding: 8px;
    border: 1px solid var(--m-line);
    border-radius: 7px;
    color: #bcc9d4;
    font-size: 10px;
  }

  .mobile-catalog-example strong {
    color: var(--m-primary);
    font-size: 12px;
  }

  /* M12 结果与显示设置 */
  .mobile-result-settings {
    padding-bottom: 20px !important;
  }

  .mobile-settings-card {
    margin-top: 8px;
    padding: 9px;
    border: 1px solid var(--m-line);
    border-radius: 9px;
    background: rgba(9, 25, 40, 0.86);
  }

  .mobile-settings-card > header {
    display: flex;
    min-height: 35px;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }

  .mobile-settings-card h2 {
    margin: 0;
    font-size: 15px;
  }

  .mobile-settings-card header p,
  .mobile-settings-card header > span {
    margin: 3px 0 0;
    color: var(--m-muted);
    font-size: 10px;
  }

  .mobile-column-list {
    max-height: 292px;
    margin-top: 4px;
    overflow: hidden;
    border: 1px solid var(--m-line-soft);
    border-radius: 7px;
  }

  .mobile-column-list.expanded {
    max-height: none;
  }

  .mobile-column-option {
    display: grid;
    grid-template-columns: 23px 27px minmax(0, 1fr) auto;
    min-height: 40px;
    align-items: center;
    gap: 6px;
    padding: 0 8px;
    border-bottom: 1px solid var(--m-line-soft);
    color: #e6ecf2;
    font-size: 12px;
  }

  .mobile-column-option:last-child {
    border-bottom: 0;
  }

  .mobile-column-option > i {
    color: #6f879b;
    font-style: normal;
    letter-spacing: -2px;
  }

  .mobile-column-option input,
  .mobile-custom-factor-row input {
    width: 19px;
    height: 19px;
    min-height: 0;
    accent-color: var(--m-primary);
  }

  .mobile-column-option em {
    color: var(--m-muted);
    font-size: 10px;
    font-style: normal;
  }

  .mobile-column-preview {
    display: flex;
    min-height: 54px;
    align-items: center;
    gap: 9px;
    margin-top: 7px;
    padding: 7px 8px;
    overflow-x: auto;
    border: 1px solid var(--m-line-soft);
    border-radius: 7px;
    color: var(--m-muted);
    font-size: 9px;
    scrollbar-width: none;
  }

  .mobile-column-preview span {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .mobile-column-preview span:first-child,
  .mobile-column-preview span:nth-child(2) {
    color: #f1f5f8;
  }

  .mobile-settings-toggle label {
    display: flex;
    min-height: 54px;
    align-items: center;
    justify-content: space-between;
    gap: 9px;
    padding: 4px 7px;
    border: 1px solid var(--m-line-soft);
    border-radius: 7px;
  }

  .mobile-settings-toggle strong,
  .mobile-settings-toggle small {
    display: block;
  }

  .mobile-settings-toggle strong {
    font-size: 13px;
  }

  .mobile-settings-toggle small {
    margin-top: 4px;
    color: var(--m-muted);
    font-size: 9px;
  }

  .mobile-settings-toggle input,
  .mobile-advanced-expression header input {
    position: absolute;
    opacity: 0;
  }

  .mobile-settings-toggle label > i,
  .mobile-advanced-expression header label > i {
    position: relative;
    width: 40px;
    height: 23px;
    flex: 0 0 auto;
    border-radius: 999px;
    background: #637588;
  }

  .mobile-settings-toggle label > i::after,
  .mobile-advanced-expression header label > i::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 17px;
    height: 17px;
    border-radius: 50%;
    background: white;
    transition: transform 150ms ease;
  }

  .mobile-settings-toggle input:checked + i,
  .mobile-advanced-expression header input:checked + i {
    background: var(--m-primary);
  }

  .mobile-settings-toggle input:checked + i::after,
  .mobile-advanced-expression header input:checked + i::after {
    transform: translateX(17px);
  }

  .mobile-settings-coverage > div {
    display: grid;
    gap: 7px;
    margin: 5px 0 7px;
  }

  .mobile-settings-coverage article {
    display: grid;
    grid-template-columns: minmax(0, 90px) minmax(0, 1fr) 42px auto;
    align-items: center;
    gap: 6px;
    color: var(--m-muted);
    font-size: 10px;
  }

  .mobile-coverage-bar {
    height: 5px;
    overflow: hidden;
    border-radius: 999px;
    background: #21364c;
  }

  .mobile-coverage-bar i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--m-primary);
  }

  .mobile-settings-coverage article strong {
    color: var(--m-primary);
    font-size: 11px;
    font-variant-numeric: tabular-nums;
  }

  .mobile-settings-coverage article em {
    color: var(--m-amber);
    font-size: 10px;
    font-style: normal;
  }

  .mobile-settings-coverage > button {
    width: 100%;
    min-height: 40px;
    border: 1px solid var(--m-line);
    border-radius: 7px;
    background: transparent;
    color: var(--m-primary);
    font-size: 12px;
  }

  .mobile-settings-data > div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 4px;
  }

  .mobile-settings-data button {
    min-height: 44px;
    border: 1px solid var(--m-line);
    border-radius: 7px;
    background: transparent;
    color: #aab7c4;
    font-size: 12px;
  }

  .mobile-settings-data button:disabled {
    opacity: 0.45;
  }

  .mobile-settings-data p {
    margin: 5px 0 0;
    color: var(--m-muted);
    font-size: 9px;
  }

  /* M13 我的因子 */
  .mobile-tool-tabs,
  .mobile-custom-view-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin-top: 8px;
  }

  .mobile-tool-tabs button,
  .mobile-custom-view-tabs button {
    border: 1px solid var(--m-line);
    border-radius: 7px;
    background: rgba(13, 27, 42, 0.72);
    color: var(--m-muted);
    font-size: 14px;
  }

  .mobile-tool-tabs button.active,
  .mobile-custom-view-tabs button.active {
    border-color: var(--m-primary);
    color: var(--m-primary);
  }

  .mobile-custom-factors > .mobile-tool-search {
    margin-top: 8px;
  }

  .mobile-custom-summary {
    display: flex;
    min-height: 50px;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: 8px;
    padding: 0 10px;
    border: 1px solid var(--m-line);
    border-radius: 8px;
    background: rgba(13, 27, 42, 0.74);
  }

  .mobile-custom-summary strong {
    font-size: 15px;
  }

  .mobile-custom-summary strong b {
    color: var(--m-primary);
    font-size: 22px;
  }

  .mobile-custom-summary span {
    color: var(--m-muted);
    font-size: 9px;
    text-align: right;
  }

  .mobile-custom-view-tabs {
    gap: 0;
  }

  .mobile-custom-view-tabs button {
    border-radius: 7px 0 0 7px;
  }

  .mobile-custom-view-tabs button + button {
    border-left: 0;
    border-radius: 0 7px 7px 0;
  }

  .mobile-custom-factor-list {
    max-height: none;
    margin-top: 8px;
    overflow: visible;
    border: 1px solid var(--m-line);
    border-radius: 8px;
    background: rgba(9, 25, 40, 0.83);
  }

  .mobile-custom-factor-list.expanded {
    max-height: none;
    overflow: visible;
  }

  .mobile-custom-factor-group + .mobile-custom-factor-group {
    border-top: 6px solid rgba(4, 15, 27, 0.9);
  }

  .mobile-custom-factor-group > h3 {
    position: sticky;
    z-index: 2;
    top: 0;
    display: flex;
    min-height: 34px;
    align-items: center;
    justify-content: space-between;
    margin: 0;
    padding: 0 10px;
    border-bottom: 1px solid rgba(54, 215, 192, 0.32);
    background: rgba(10, 39, 55, 0.98);
    color: var(--m-primary);
    font-size: 12px;
  }

  .mobile-custom-factor-group > h3 b {
    color: var(--m-muted);
    font-size: 9px;
    font-weight: 500;
  }

  .mobile-custom-factor-row {
    display: grid;
    grid-template-columns: 25px minmax(0, 1fr) auto 35px;
    min-height: 52px;
    align-items: center;
    gap: 7px;
    padding: 0 9px;
    border-bottom: 1px solid var(--m-line-soft);
  }

  .mobile-custom-factor-row:last-child {
    border-bottom: 0;
  }

  .mobile-custom-factor-row > button {
    display: block;
    min-width: 0;
    min-height: 44px;
    padding: 0;
    overflow: hidden;
    border: 0;
    background: transparent;
    color: #eef2f6;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-custom-factor-row > button strong,
  .mobile-custom-factor-row > button small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-custom-factor-row > button strong {
    font-size: 13px;
  }

  .mobile-custom-factor-row > button small {
    margin-top: 3px;
    color: var(--m-muted);
    font-size: 9px;
  }

  .mobile-custom-factor-row > span {
    padding: 3px 5px;
    border: 1px solid var(--m-line);
    border-radius: 5px;
    color: #9fb1c2;
    font-size: 9px;
  }

  .mobile-custom-factor-row > em {
    color: #b8c4cf;
    font-size: 18px;
    font-style: normal;
  }

  .mobile-custom-selected-preview {
    margin-top: 8px;
    padding: 9px;
    border: 1px solid rgba(54, 215, 192, 0.55);
    border-radius: 8px;
    background: rgba(8, 27, 42, 0.87);
  }

  .mobile-custom-selected-preview > header {
    display: flex;
    min-height: 34px;
    align-items: center;
    justify-content: space-between;
  }

  .mobile-custom-selected-preview h2 {
    margin: 0;
    font-size: 14px;
  }

  .mobile-custom-selected-preview header span {
    color: var(--m-primary);
    font-size: 11px;
  }

  .mobile-custom-selected-preview > div {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .mobile-custom-selected-preview > div button {
    min-height: 38px;
    flex: 0 0 auto;
    padding: 0 9px;
    border: 1px solid var(--m-line);
    border-radius: 6px;
    background: transparent;
    color: #cbd5de;
    font-size: 10px;
  }

  .mobile-custom-selected-preview > article {
    min-height: 72px;
    margin-top: 7px;
    padding: 8px;
    border: 1px solid var(--m-line-soft);
    border-radius: 7px;
    color: #b8c5d0;
    font-size: 10px;
    line-height: 1.55;
  }

  .mobile-custom-selected-preview > article strong {
    display: block;
    margin-bottom: 4px;
    color: #edf2f6;
    font-size: 13px;
  }

  /* M15 教程 */
  .mobile-screener-guide {
    padding: 10px 8px 22px !important;
  }

  .mobile-guide-tabs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    min-height: 46px;
    margin-top: 6px;
    overflow: hidden;
    border: 1px solid var(--m-line);
    border-radius: 8px;
  }

  .mobile-guide-tabs button {
    position: relative;
    min-width: 0;
    padding: 0 3px;
    border: 0;
    background: transparent;
    color: #a9b6c3;
    font-size: 11px;
    white-space: nowrap;
  }

  .mobile-guide-tabs button.active {
    color: var(--m-primary);
  }

  .mobile-guide-tabs button.active::after {
    content: "";
    position: absolute;
    right: 10px;
    bottom: 0;
    left: 10px;
    height: 2px;
    background: var(--m-primary);
  }

  .mobile-guide-boundary {
    display: flex;
    min-height: 54px;
    align-items: center;
    gap: 11px;
    margin-top: 8px;
    padding: 7px 12px;
    border: 1px solid #1784d6;
    border-radius: 9px;
    background: rgba(13, 50, 96, 0.55);
  }

  .mobile-guide-boundary span {
    color: #36c7ff;
    font-size: 24px;
  }

  .mobile-guide-boundary strong {
    min-width: 0;
    flex: 1 1 auto;
    font-size: 13px;
  }

  .mobile-guide-boundary i {
    display: grid;
    width: 30px;
    height: 34px;
    flex: 0 0 30px;
    place-items: center;
    border: 2px solid #2d8fff;
    border-radius: 6px 6px 10px 10px;
    color: #51a6ff;
    font-size: 17px;
    font-style: normal;
  }

  .mobile-guide-step-list {
    position: relative;
    display: grid;
    gap: 7px;
    margin-top: 8px;
    padding-left: 30px;
  }

  .mobile-guide-step-list::before {
    content: "";
    position: absolute;
    top: 24px;
    bottom: 24px;
    left: 15px;
    width: 1px;
    background: rgba(63, 154, 219, 0.7);
  }

  .mobile-guide-step {
    position: relative;
    min-height: 70px;
    padding: 9px;
    border: 1px solid var(--m-line);
    border-radius: 8px;
    background: linear-gradient(145deg, rgba(15, 36, 57, 0.96), rgba(9, 28, 45, 0.88));
  }

  .mobile-guide-step > b {
    position: absolute;
    top: 10px;
    left: -38px;
    display: grid;
    width: 31px;
    height: 31px;
    place-items: center;
    border-radius: 50%;
    background: linear-gradient(145deg, #087eec, #27d9ef);
    box-shadow: 0 0 14px rgba(28, 169, 239, 0.34);
    color: white;
    font-size: 16px;
  }

  .mobile-guide-step h2 {
    margin: 0;
    font-size: 14px;
  }

  .mobile-guide-step p {
    margin: 5px 0 0;
    color: #b1bfca;
    font-size: 10px;
    line-height: 1.5;
  }

  .mobile-guide-step-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 6px;
  }

  .mobile-guide-step-chips > span {
    padding: 3px 6px;
    border: 1px solid var(--m-line);
    border-radius: 5px;
    color: #c7d2dc;
    font-size: 9px;
  }

  .mobile-guide-step strong {
    color: var(--m-primary);
  }

  .mobile-guide-rich-step {
    min-height: 0;
    padding: 9px 9px 10px;
  }

  .mobile-guide-rich-step > h2 {
    margin-bottom: 7px;
  }

  .mobile-guide-rich-step strong {
    color: #f2f6fa;
  }

  .mobile-guide-date-grid,
  .mobile-guide-result-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
  }

  .mobile-guide-date-grid > div,
  .mobile-guide-result-stats > div {
    min-width: 0;
    padding: 8px 9px;
    border: 1px solid #294a67;
    border-radius: 7px;
    background: rgba(7, 24, 41, 0.78);
  }

  .mobile-guide-date-grid small,
  .mobile-guide-result-stats small {
    display: block;
    color: var(--m-muted);
    font-size: 9px;
  }

  .mobile-guide-date-grid strong,
  .mobile-guide-result-stats strong {
    display: block;
    margin-top: 3px;
    overflow: hidden;
    color: #eef6fc;
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-guide-strategy-card {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 8px;
    border: 1px solid #2e5e84;
    border-radius: 7px;
    background: rgba(9, 30, 50, 0.86);
  }

  .mobile-guide-strategy-icon {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 7px;
    background: #123b64;
    color: #41c9ff;
    font-size: 20px;
  }

  .mobile-guide-strategy-copy {
    min-width: 0;
  }

  .mobile-guide-strategy-copy strong,
  .mobile-guide-strategy-copy small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-guide-strategy-copy strong {
    font-size: 12px;
  }

  .mobile-guide-strategy-copy small {
    margin-top: 3px;
    color: var(--m-muted);
    font-size: 8px;
  }

  .mobile-guide-inline-actions {
    display: flex;
    gap: 5px;
  }

  .mobile-guide-inline-actions a,
  .mobile-guide-inline-actions button,
  .mobile-guide-row-action,
  .mobile-guide-view-all {
    min-height: 30px;
    padding: 0 7px;
    border: 1px solid #2fbfff;
    border-radius: 6px;
    background: transparent;
    color: #eaf7ff;
    font: inherit;
    font-size: 8px;
    font-weight: 700;
    line-height: 28px;
    text-decoration: none;
    white-space: nowrap;
  }

  .mobile-guide-inline-actions button,
  .mobile-guide-row-action.primary {
    background: #139fe1;
  }

  .mobile-guide-scope-panel,
  .mobile-guide-setting-list,
  .mobile-guide-rule-list,
  .mobile-guide-result-preview {
    overflow: hidden;
    border: 1px solid #294a67;
    border-radius: 7px;
    background: rgba(7, 24, 41, 0.78);
  }

  .mobile-guide-scope-row,
  .mobile-guide-setting-row {
    display: grid;
    grid-template-columns: 68px minmax(0, 1fr) 18px;
    min-height: 37px;
    align-items: center;
    gap: 6px;
    padding: 0 8px;
    border-bottom: 1px solid var(--m-line-soft);
  }

  .mobile-guide-scope-row:last-child,
  .mobile-guide-setting-row:last-child {
    border-bottom: 0;
  }

  .mobile-guide-scope-row > span,
  .mobile-guide-setting-row > span {
    color: #c7d4df;
    font-size: 10px;
  }

  .mobile-guide-mini-chips {
    display: flex;
    min-width: 0;
    gap: 4px;
    overflow: hidden;
  }

  .mobile-guide-mini-chips i {
    min-width: 0;
    padding: 3px 5px;
    overflow: hidden;
    border: 1px solid #294a67;
    border-radius: 5px;
    color: #a9d8f0;
    font-size: 8px;
    font-style: normal;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-guide-scope-row > button,
  .mobile-guide-setting-row > button {
    min-width: 18px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #9eb3c5;
    font-size: 17px;
  }

  .mobile-guide-rule-row {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) 20px;
    min-height: 34px;
    align-items: center;
    gap: 6px;
    padding: 0 8px;
    border-bottom: 1px solid var(--m-line-soft);
  }

  .mobile-guide-rule-row b {
    display: grid;
    width: 22px;
    height: 22px;
    place-items: center;
    border-radius: 4px;
    background: #123b64;
    color: #9edcff;
    font-size: 9px;
  }

  .mobile-guide-rule-row span {
    overflow: hidden;
    color: #dce6ed;
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-guide-rule-row i {
    color: #71869a;
    font-size: 13px;
    font-style: normal;
  }

  .mobile-guide-rule-footer {
    display: flex;
    min-height: 34px;
    align-items: center;
    justify-content: flex-end;
    padding: 3px 7px;
  }

  .mobile-guide-result-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 7px;
    border-bottom: 1px solid var(--m-line-soft);
  }

  .mobile-guide-result-stats > div {
    padding: 5px;
    border: 0;
    text-align: center;
  }

  .mobile-guide-result-stats strong {
    color: var(--m-primary);
    font-size: 11px;
  }

  .mobile-guide-result-table {
    font-size: 8px;
  }

  .mobile-guide-result-row {
    display: grid;
    grid-template-columns: 56px minmax(54px, 1fr) 45px 45px 40px 48px;
    min-height: 28px;
    align-items: center;
    gap: 3px;
    padding: 0 6px;
    border-bottom: 1px solid var(--m-line-soft);
  }

  .mobile-guide-result-row > span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-guide-result-row.head {
    color: #8da3b6;
  }

  .mobile-guide-result-row .positive { color: var(--m-up); }
  .mobile-guide-result-row .negative { color: var(--m-down); }

  .mobile-guide-result-empty {
    padding: 14px 8px;
    color: var(--m-muted);
    font-size: 9px;
    text-align: center;
  }

  .mobile-guide-view-all {
    display: block;
    width: max-content;
    margin: 6px auto;
    border: 0;
    color: var(--m-primary);
  }

  .mobile-guide-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 9px;
  }

  .mobile-guide-actions button {
    min-height: 48px;
    border: 1px solid #30cfff;
    border-radius: 8px;
    background: transparent;
    color: #eaf5fb;
    font-size: 14px;
    font-weight: 700;
  }

  .mobile-guide-actions button:first-child {
    background: linear-gradient(135deg, #158bea, #2ad2ef);
  }

  /* M16 高级规则与排序 */
  .mobile-advanced-rules {
    padding: 10px 8px 22px !important;
  }

  .mobile-advanced-card {
    margin-top: 7px;
    padding: 8px;
    border: 1px solid #2d75ac;
    border-radius: 9px;
    background: rgba(9, 28, 45, 0.88);
  }

  .mobile-advanced-card > header {
    display: flex;
    min-height: 37px;
    align-items: center;
    gap: 8px;
  }

  .mobile-advanced-card > header > b {
    display: grid;
    width: 28px;
    height: 28px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 50%;
    background: linear-gradient(145deg, #1679ec, #2ab7ff);
    color: white;
    font-size: 14px;
  }

  .mobile-advanced-card h2 {
    min-width: 0;
    flex: 1;
    margin: 0;
    font-size: 15px;
  }

  .mobile-advanced-card header > select {
    max-width: 146px;
    padding: 0 7px;
    border: 1px solid var(--m-line);
    border-radius: 6px;
    background: #0a1b2c;
    color: #d5dee6;
    font-size: 10px;
  }

  .mobile-advanced-scope {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    min-height: 44px;
    overflow: hidden;
    border: 1px solid #5a7690;
    border-radius: 7px;
  }

  .mobile-advanced-scope button {
    min-width: 0;
    border: 0;
    border-right: 1px solid #5a7690;
    background: transparent;
    color: #c8d3dc;
    font-size: 11px;
  }

  .mobile-advanced-scope button:last-child {
    border-right: 0;
  }

  .mobile-advanced-scope button.active {
    background: linear-gradient(135deg, #1378e9, #299cf0);
    color: white;
  }

  .mobile-advanced-rule-block {
    margin-top: 6px;
    padding: 7px;
    border: 1px solid var(--m-line);
    border-radius: 7px;
  }

  .mobile-advanced-rule-block > div {
    display: flex;
    min-height: 35px;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }

  .mobile-advanced-rule-block > div strong {
    font-size: 13px;
  }

  .mobile-advanced-rule-block > div span {
    color: var(--m-muted);
    font-size: 9px;
  }

  .mobile-advanced-rule-block select {
    min-height: 34px;
    padding: 0 22px 0 8px;
    border: 1px solid var(--m-line);
    border-radius: 6px;
    background: #0a1b2c;
    color: #d7dfe7;
    font-size: 10px;
  }

  .mobile-advanced-rule-block > button,
  .mobile-advanced-card > .mobile-tool-more {
    margin-top: 6px;
  }

  .mobile-advanced-rule-row,
  .mobile-advanced-sort-row {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) auto 34px;
    min-height: 42px;
    align-items: center;
    gap: 6px;
    padding: 0 4px;
    border-top: 1px solid var(--m-line-soft);
    font-size: 10px;
  }

  .mobile-advanced-rule-row > b,
  .mobile-advanced-sort-row > b {
    display: grid;
    width: 21px;
    height: 21px;
    place-items: center;
    border-radius: 50%;
    background: #1679e9;
    font-size: 10px;
  }

  .mobile-advanced-rule-row > span,
  .mobile-advanced-sort-row > span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-advanced-rule-row > em,
  .mobile-advanced-sort-row > em {
    color: #c4d0da;
    font-size: 9px;
    font-style: normal;
  }

  .mobile-advanced-rule-row > button,
  .mobile-advanced-sort-row > button {
    min-height: 34px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--m-up);
    font-size: 18px;
  }

  .mobile-advanced-excludes {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
  }

  .mobile-advanced-excludes button {
    min-height: 36px;
    padding: 0 8px;
    border: 1px solid #526d85;
    border-radius: 6px;
    background: transparent;
    color: #becbd5;
    font-size: 10px;
  }

  .mobile-advanced-sort-list {
    border: 1px solid var(--m-line-soft);
    border-radius: 7px;
  }

  .mobile-advanced-sort-row {
    grid-template-columns: 23px minmax(0, 1fr) minmax(84px, auto) 33px;
    min-height: 44px;
  }

  .mobile-advanced-sort-row select {
    width: 100%;
    min-width: 0;
    min-height: 34px;
    padding: 0 5px;
    border: 1px solid var(--m-line);
    border-radius: 5px;
    background: #091928;
    color: #c8d3dc;
    font-size: 9px;
  }

  .mobile-advanced-vip {
    display: flex;
    width: 100%;
    min-height: 42px;
    align-items: center;
    justify-content: space-between;
    margin-top: 7px;
    padding: 0 9px;
    border: 1px solid var(--m-line);
    border-radius: 7px;
    background: transparent;
    color: #e0e6eb;
    font: inherit;
    font-size: 11px;
  }

  .mobile-advanced-vip span {
    color: var(--m-muted);
  }

  .mobile-advanced-expression > header label {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--m-muted);
    font-size: 9px;
  }

  .mobile-advanced-expression > label {
    display: grid;
    grid-template-columns: 70px minmax(0, 1fr);
    align-items: center;
    gap: 7px;
    margin-top: 6px;
    color: var(--m-muted);
    font-size: 10px;
  }

  .mobile-advanced-expression textarea {
    width: 100%;
    min-height: 48px;
    padding: 8px;
    resize: vertical;
    border: 1px solid var(--m-line);
    border-radius: 6px;
    outline: 0;
    background: #091827;
    color: #9fe6cc;
    font-family: Consolas, monospace;
    font-size: 10px;
    line-height: 1.45;
  }

  .mobile-advanced-expression > p {
    margin: 7px 0 0;
    color: var(--m-down);
    font-size: 10px;
  }

  /* M14 reuses the existing operation dialogs; only the mobile presentation changes. */
  body > dialog.save-filter-dialog,
  body > dialog.rename-filter-dialog,
  body > dialog.delete-filter-dialog,
  body > dialog.reset-settings-dialog,
  body > dialog.holding-success-dialog,
  body > dialog.error-dialog,
  body > dialog.mobile-unsaved-task-dialog {
    width: calc(100vw - 24px);
    max-width: 410px;
    padding: 0;
    overflow: hidden;
    border: 1px solid #36526d;
    border-radius: 12px;
    background: linear-gradient(145deg, #10233a, #0a1b2e);
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.48);
    color: #f0f4f8;
  }

  body > dialog.save-filter-dialog .dialog-head,
  body > dialog.rename-filter-dialog .dialog-head,
  body > dialog.delete-filter-dialog .dialog-head,
  body > dialog.reset-settings-dialog .dialog-head {
    padding: 15px 16px 8px;
    border-bottom: 0;
    text-align: center;
  }

  body > dialog.save-filter-dialog .dialog-head h2,
  body > dialog.rename-filter-dialog .dialog-head h2,
  body > dialog.delete-filter-dialog .dialog-head h2,
  body > dialog.reset-settings-dialog .dialog-head h2,
  body > dialog.holding-success-dialog h2,
  body > dialog.error-dialog h2 {
    font-size: 18px;
  }

  body > dialog.save-filter-dialog .dialog-head p,
  body > dialog.rename-filter-dialog .dialog-head p,
  body > dialog.delete-filter-dialog .dialog-head p,
  body > dialog.reset-settings-dialog .dialog-head p {
    font-size: 10px;
  }

  body > dialog.save-filter-dialog .save-filter-body,
  body > dialog.rename-filter-dialog .save-filter-body,
  body > dialog.delete-filter-dialog .delete-filter-body,
  body > dialog.reset-settings-dialog .delete-filter-body,
  body > dialog.holding-success-dialog .holding-success-body,
  body > dialog.error-dialog .error-dialog-body {
    padding: 8px 16px 13px;
  }

  body > dialog.work-dialog .dialog-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    height: auto;
    gap: 8px;
    padding: 10px 16px 15px;
    border-top: 1px solid rgba(61, 91, 119, 0.38);
  }

  body > dialog.error-dialog .dialog-actions {
    grid-template-columns: 1fr;
  }

  body > dialog.error-dialog.has-retry .dialog-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body > dialog.work-dialog .dialog-actions button,
  body > dialog.work-dialog .dialog-actions a {
    height: 46px;
    min-height: 46px;
    border-radius: 7px;
    font-size: 14px;
  }

  body > dialog.work-dialog .dialog-actions .compact-primary {
    width: 100%;
    white-space: nowrap;
  }

  body > dialog.holding-success-dialog .holding-success-icon {
    background: var(--m-down);
    box-shadow: 0 0 18px rgba(48, 212, 138, 0.3);
  }

  body > dialog.error-dialog .error-dialog-icon {
    background: var(--m-up);
  }
}

/* Keep this final in the cascade: M04 compact acceptance viewport. */
@media (min-width: 351px) and (max-width: 767px) and (max-height: 900px) {
  .mobile-screener:not([hidden]) {
    position: relative;
    height: 100dvh;
    min-height: 0;
    padding: 18px 12px 60px;
    overflow: hidden;
  }

  .mobile-screener button,
  .mobile-screener select,
  .mobile-screener a { min-height: 0; }
  .mobile-screener-head { height: 48px; padding: 0 4px 5px; }
  .mobile-screener-head h1 { font-size: 22px; }
  .mobile-screener-head p { margin-top: 3px; font-size: 11px; }
  .mobile-help-btn { width: 28px; height: 28px; min-height: 28px; font-size: 18px; }
  .mobile-snapshot-row { grid-template-columns: minmax(0, 1.18fr) minmax(0, .92fr) minmax(78px, .82fr); height: 34px; gap: 7px; padding: 0 0 7px; }
  .mobile-snapshot-row label { height: 27px; min-height: 27px; padding: 0 7px; border-radius: 5px; }
  .mobile-snapshot-row label > span,
  .mobile-snapshot-row select,
  .mobile-snapshot-row > small { font-size: 10px; }
  .mobile-snapshot-row select { padding-left: 4px; }
  .mobile-snapshot-row > small { grid-column: 3; grid-row: 1; align-self: center; justify-self: start; margin: 0; padding: 0; white-space: nowrap; }
  .mobile-package-status { height: 30px; min-height: 30px; margin-bottom: 7px; padding: 0 8px; border-radius: 5px; }
  .mobile-package-copy strong,
  .mobile-package-status > b { font-size: 11px; }
  .mobile-current-strategy { height: 50px; min-height: 50px; margin-bottom: 6px; padding: 5px 9px; border-radius: 6px; }
  .mobile-current-strategy-copy > span { font-size: 9px; }
  .mobile-current-strategy-copy strong { max-width: 145px; margin-top: 2px; font-size: 12px; }
  .mobile-current-strategy-copy em { min-height: 18px; margin-top: 2px; padding: 0 5px; font-size: 8px; }
  .mobile-strategy-links { flex-basis: 136px; gap: 5px; }
  .mobile-strategy-links button,
  .mobile-strategy-links a { min-height: 32px; font-size: 11px; }
  .mobile-condition-tabs { height: 34px; margin-top: 5px; }
  .mobile-condition-tabs button { min-height: 34px; font-size: 13px; }
  .mobile-condition-summary { height: 71px; min-height: 71px; padding: 8px 0; }
  .mobile-condition-chips {
    display: grid;
    grid-auto-columns: calc((100% - 5px) / 2);
    grid-auto-flow: column;
    grid-template-rows: repeat(2, 25px);
    max-height: 55px;
    gap: 5px;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  .mobile-condition-chips > span {
    width: 100%;
    scroll-snap-align: start;
  }
  .mobile-condition-chips > span { min-height: 25px; padding: 0 8px; border-radius: 5px; font-size: 9px; }
  .mobile-edit-conditions { min-width: 78px; min-height: 28px; padding: 0 7px; font-size: 10px; }
  .mobile-selection-summary { height: 76px; min-height: 76px; padding: 9px; border-radius: 6px; }
  .mobile-selection-summary span { font-size: 9px; }
  .mobile-selection-summary strong { margin-top: 5px; font-size: 16px; }
  #mobileRunBtn { min-height: 40px; font-size: 14px; }

  .mobile-result-section { position: absolute; top: 405px; right: 12px; left: 12px; height: 318px; margin: 0; overflow: hidden; }
  .mobile-result-head { height: 48px; min-height: 48px; }
  .mobile-result-head h2 { font-size: 17px; }
  .mobile-holdings-switch { font-size: 10px; }
  .mobile-holdings-switch i { width: 31px; height: 18px; }
  .mobile-holdings-switch i::after { top: 2px; left: 2px; width: 14px; height: 14px; }
  .mobile-holdings-switch input:checked + i::after { transform: translateX(13px); }
  .mobile-result-list { height: 270px; max-height: 270px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
  .mobile-result-card { grid-template-columns: minmax(82px, .95fr) minmax(44px, .5fr) minmax(126px, 1.45fr) 46px; grid-template-areas: "identity price metrics action"; height: 67px; min-height: 67px; column-gap: 3px; row-gap: 0; padding: 6px; }
  .mobile-result-card.top-ranked { height: 67px; min-height: 67px; }
  .mobile-rank-badge { top: 11px; left: 6px; width: 34px; height: 34px; font-size: 9px; }
  .mobile-result-card.top-ranked .mobile-stock-identity { padding-left: 38px; }
  .mobile-stock-identity a { font-size: 12px; }
  .mobile-stock-identity > span,
  .mobile-stock-price > span { margin-top: 3px; font-size: 9px; }
  .mobile-stock-price strong { font-size: 12px; }
  .mobile-stock-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: center; gap: 2px; }
  .mobile-stock-metrics > div { min-width: 0; }
  .mobile-stock-metrics span,
  .mobile-stock-metrics strong { display: block; white-space: nowrap; }
  .mobile-stock-metrics span { overflow: hidden; font-size: 7px; text-overflow: ellipsis; }
  .mobile-stock-metrics strong { margin-top: 3px; font-size: 9px; letter-spacing: -.15px; line-height: 1.05; overflow-wrap: anywhere; white-space: normal; }
  .mobile-add-holding { width: 46px; min-width: 46px; min-height: 31px; padding: 0 2px; font-size: 9px; }
  .mobile-result-empty { min-height: 270px; padding: 18px; }
  .mobile-page-state { top: calc(env(safe-area-inset-top, 0px) + 12px); height: auto; min-height: 150px; grid-template-columns: 28px 42px minmax(0, 1fr); gap: 8px; padding: 12px 46px 12px 10px; }
  .mobile-page-state-index { width: 27px; height: 27px; font-size: 13px; }
  .mobile-page-state-icon { width: 40px; height: 40px; font-size: 21px; }
  .mobile-page-state-copy > strong { font-size: 15px; }
  .mobile-page-state-copy > p { font-size: 10px; }
  .mobile-page-state-actions button { min-height: 34px; font-size: 10px; }
  .mobile-result-tools { position: absolute; right: 12px; bottom: 84px; left: 12px; height: 34px; margin: 0; }
  .mobile-result-tools button { min-height: 34px; border-radius: 5px; font-size: 10px; }
  .mobile-result-tools button span { font-size: 13px; }
  .mobile-browser-boundary { position: absolute; right: 8px; bottom: 60px; left: 8px; height: 24px; margin: 0; font-size: 9px; line-height: 24px; white-space: nowrap; }
  .mobile-screener > .mobile-bottom-nav { min-height: 60px; height: 60px; padding: 4px 5px; }
  .mobile-screener > .mobile-bottom-nav a { min-height: 52px; gap: 2px; font-size: 9px; }
  .mobile-screener > .mobile-bottom-nav .mobile-nav-icon { width: 21px; height: 21px; }

  .mobile-result-virtual-spacer {
    position: relative;
    width: 100%;
  }

  .mobile-result-window {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    will-change: transform;
    contain: layout paint style;
  }
}

@media (max-width: 767px) {
  .mobile-sticky-actions {
    position: sticky;
    z-index: 45;
    bottom: 0;
    padding: 8px 0 max(8px, env(safe-area-inset-bottom));
    background: linear-gradient(to bottom, rgba(7, 17, 30, 0.2), #07111e 22%);
  }

  .mobile-advanced-rule-block > button {
    min-height: 40px;
    padding: 0 10px;
    border: 1px solid var(--m-primary);
    border-radius: 6px;
    background: transparent;
    color: var(--m-primary);
    font-size: 11px;
  }

  .mobile-advanced-rule-row select,
  .mobile-advanced-rule-row input,
  .mobile-advanced-sort-row input {
    width: 100%;
    min-width: 0;
    min-height: 34px;
    padding: 0 6px;
    border: 1px solid var(--m-line);
    border-radius: 5px;
    outline: 0;
    background: #091928;
    color: #d6dfe7;
    font-size: 9px;
  }

  .mobile-advanced-rule-row > em {
    display: grid;
    grid-template-columns: minmax(76px, 1fr) minmax(58px, .8fr);
    gap: 3px;
  }
}

/*
 * M08/M09/M11/M12/M13/M16 compact acceptance layout.
 * Real rules and factors remain in the DOM; long collections scroll inside
 * their own cards so the next section and the primary action stay reachable.
 */
@media (min-width: 351px) and (max-width: 767px) and (max-height: 900px) {
  .mobile-condition-workspace:not([hidden]),
  .mobile-rule-editor:not([hidden]),
  .mobile-result-settings:not([hidden]),
  .mobile-custom-factors:not([hidden]),
  .mobile-advanced-rules:not([hidden]) {
    min-height: 100dvh;
    padding: 8px 8px 74px !important;
  }

  .mobile-condition-workspace:not([hidden]) {
    padding-bottom: 112px !important;
  }

  .mobile-condition-workspace .mobile-flow-head,
  .mobile-rule-editor .mobile-flow-head,
  .mobile-factor-catalog .mobile-flow-head,
  .mobile-result-settings .mobile-flow-head,
  .mobile-custom-factors .mobile-flow-head,
  .mobile-advanced-rules .mobile-flow-head {
    min-height: 42px;
  }

  .mobile-condition-workspace .mobile-flow-head h1,
  .mobile-rule-editor .mobile-flow-head h1,
  .mobile-factor-catalog .mobile-flow-head h1,
  .mobile-result-settings .mobile-flow-head h1,
  .mobile-custom-factors .mobile-flow-head h1,
  .mobile-advanced-rules .mobile-flow-head h1 {
    font-size: 18px;
  }

  .mobile-condition-workspace .mobile-flow-link,
  .mobile-rule-editor .mobile-flow-link,
  .mobile-factor-catalog .mobile-flow-link,
  .mobile-result-settings .mobile-flow-link,
  .mobile-custom-factors .mobile-flow-link,
  .mobile-advanced-rules .mobile-flow-link {
    font-size: 13px;
  }

  /* M08: two compact visible rule rows; additional real rules scroll. */
  .mobile-flow-crumbs {
    min-height: 24px;
    gap: 5px;
    font-size: 10px;
  }

  .mobile-flow-crumbs button {
    min-height: 24px;
  }

  .mobile-flow-crumbs i {
    font-size: 16px;
  }

  .mobile-dirty-state {
    min-height: 24px;
    font-size: 11px;
  }

  .mobile-workspace-snapshot {
    height: 32px;
    margin: 1px auto 5px;
  }

  .mobile-workspace-snapshot label,
  .mobile-workspace-snapshot select {
    min-height: 30px;
    font-size: 10px;
  }

  .mobile-workspace-current {
    min-height: 36px;
    margin-bottom: 4px;
    padding: 0 7px;
  }

  .mobile-workspace-current span,
  .mobile-workspace-current button {
    font-size: 10px;
  }

  .mobile-workspace-current strong {
    font-size: 12px;
  }

  .mobile-workspace-current button {
    min-height: 28px;
  }

  .mobile-workspace-section {
    margin-top: 4px;
    padding: 6px;
    border-radius: 7px;
  }

  .mobile-workspace-section > header {
    min-height: 30px;
    gap: 6px;
  }

  .mobile-workspace-section > header > b {
    width: 27px;
    height: 27px;
    border-radius: 6px;
    font-size: 12px;
  }

  .mobile-workspace-section h2 {
    font-size: 14px;
  }

  .mobile-workspace-section > header > select,
  .mobile-workspace-section > header > span {
    min-height: 28px;
    max-width: 142px;
    padding: 0 6px;
    font-size: 9px;
  }

  .mobile-scope-options {
    gap: 5px;
    margin-top: 4px;
  }

  .mobile-scope-options button {
    min-height: 30px;
    font-size: 10px;
  }

  .mobile-factor-tier-row {
    align-items: center;
  }

  .mobile-factor-tier,
  .mobile-factor-tier select,
  .mobile-workspace-tool-link {
    min-height: 30px;
    font-size: 10px;
  }

  .mobile-workspace-tool-link {
    margin-bottom: 0;
  }

  .mobile-workspace-rule-list {
    max-height: 104px;
    gap: 4px;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
  }

  .mobile-workspace-rule {
    grid-template-columns: 12px minmax(70px, 1fr) minmax(38px, auto) minmax(42px, 62px) 24px 24px;
    min-height: 50px;
    gap: 3px;
    padding: 4px;
  }

  .mobile-rule-grip {
    font-size: 14px;
  }

  .mobile-workspace-rule strong {
    font-size: 11px;
  }

  .mobile-workspace-rule small {
    margin-top: 2px;
    font-size: 8px;
  }

  .mobile-workspace-rule > span:not(.mobile-rule-grip),
  .mobile-workspace-rule > b {
    font-size: 9px;
  }

  .mobile-workspace-rule > button {
    min-width: 22px;
    min-height: 30px;
    font-size: 15px;
  }

  .mobile-workspace-add-row {
    gap: 5px;
    margin-top: 4px;
  }

  .mobile-workspace-add-row button,
  .mobile-workspace-inline-add {
    min-height: 30px;
    margin-top: 4px;
    font-size: 10px;
  }

  .mobile-workspace-chips {
    flex-wrap: nowrap;
    gap: 5px;
    max-height: 34px;
    margin-top: 4px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
  }

  .mobile-workspace-chips > span,
  .mobile-workspace-chips button {
    min-height: 30px;
    flex: 0 0 auto;
    font-size: 9px;
  }

  .mobile-workspace-chips button {
    padding: 0 7px;
  }

  .mobile-workspace-sort-list {
    max-height: 40px;
    gap: 3px;
    margin-top: 3px;
    overflow-y: auto;
    scrollbar-width: thin;
  }

  .mobile-workspace-sort-list article {
    grid-template-columns: 22px minmax(0, 1fr) auto 28px;
    min-height: 38px;
    gap: 4px;
  }

  .mobile-workspace-sort-factor,
  .mobile-workspace-sort-list article > select {
    min-height: 30px;
    font-size: 9px;
  }

  .mobile-advanced-summary > div {
    margin: 2px 0 0 33px;
  }

  .mobile-advanced-summary > div p,
  .mobile-advanced-summary > header label {
    font-size: 9px;
  }

  .mobile-advanced-summary label i {
    width: 31px;
    height: 18px;
  }

  .mobile-advanced-summary label i::after {
    top: 2px;
    left: 2px;
    width: 14px;
    height: 14px;
  }

  .mobile-advanced-summary input:checked + i::after {
    transform: translateX(13px);
  }

  .mobile-workspace-actions {
    position: fixed;
    z-index: 70;
    right: 8px;
    bottom: max(4px, env(safe-area-inset-bottom));
    left: 8px;
    margin: 0;
    padding: 6px;
    border-radius: 8px;
    box-shadow: 0 -12px 30px rgba(3, 12, 21, 0.8);
  }

  .mobile-workspace-summary {
    gap: 6px;
  }

  .mobile-workspace-summary > span {
    font-size: 19px;
  }

  .mobile-workspace-summary strong {
    font-size: 11px;
  }

  .mobile-workspace-summary small {
    margin-top: 2px;
    font-size: 8px;
  }

  .mobile-workspace-actions > div:last-child {
    gap: 5px;
    margin-top: 5px;
  }

  .mobile-workspace-actions button {
    min-height: 38px;
    font-size: 12px;
  }

  /* M09: factor, detail and setup are all visible without losing data. */
  .mobile-rule-steps {
    min-height: 30px;
    margin: 1px 0 4px;
    font-size: 10px;
  }

  .mobile-rule-steps span,
  .mobile-rule-steps b {
    min-height: 26px;
  }

  .mobile-rule-tier-tabs {
    gap: 5px;
    margin-top: 3px;
  }

  .mobile-rule-tier-tabs button,
  .mobile-rule-groups button {
    min-height: 32px;
    font-size: 10px;
  }

  .mobile-rule-search,
  .mobile-strategy-search {
    min-height: 34px;
    margin-top: 5px;
    padding: 0 7px;
  }

  .mobile-rule-search > span,
  .mobile-strategy-search > span {
    font-size: 20px;
  }

  .mobile-rule-search input,
  .mobile-strategy-search input {
    min-height: 32px;
    font-size: 10px;
  }

  .mobile-rule-groups {
    gap: 5px;
    margin: 4px 0;
  }

  .mobile-rule-groups button {
    padding: 0 8px;
  }

  .mobile-rule-factor-list {
    max-height: 132px;
    scrollbar-width: thin;
  }

  .mobile-rule-factor-list > button {
    grid-template-columns: 18px minmax(90px, .8fr) minmax(0, 1.25fr);
    min-height: 32px;
    gap: 5px;
    padding: 0 7px;
    font-size: 10px;
  }

  .mobile-rule-factor-list > button i {
    width: 13px;
    height: 13px;
  }

  .mobile-rule-factor-list > button.active i {
    border-width: 4px;
  }

  .mobile-rule-factor-list > button span {
    font-size: 8px;
  }

  .mobile-rule-detail {
    margin-top: 5px;
  }

  .mobile-rule-detail > header {
    grid-template-columns: 27px minmax(54px, 1fr) auto auto auto;
    gap: 4px;
    min-height: 34px;
    padding: 5px 7px;
  }

  .mobile-rule-detail > header > span {
    width: 25px;
    height: 25px;
  }

  .mobile-rule-detail > header strong {
    overflow: hidden;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-rule-detail > header em,
  .mobile-rule-detail > header b {
    padding: 2px 3px;
    font-size: 7px;
    white-space: nowrap;
  }

  .mobile-rule-detail dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 5px;
    max-height: 66px;
    padding: 0 7px 5px;
    overflow-y: auto;
    scrollbar-width: thin;
  }

  .mobile-rule-detail dl div {
    gap: 2px;
  }

  .mobile-rule-detail dt {
    font-size: 8px;
  }

  .mobile-rule-detail dd {
    font-size: 9px;
    line-height: 1.35;
  }

  .mobile-rule-detail > div button {
    min-height: 30px;
    font-size: 9px;
  }

  .mobile-rule-detail > p {
    max-height: 36px;
    padding: 5px 7px;
    overflow-y: auto;
    font-size: 8px;
    line-height: 1.35;
  }

  .mobile-rule-setup {
    margin-top: 5px;
    padding: 6px;
  }

  .mobile-rule-setup h2 {
    margin-bottom: 5px;
    font-size: 12px;
  }

  #mobileRuleControls {
    gap: 5px;
  }

  #mobileRuleControls > select,
  .mobile-rule-number,
  .mobile-rule-no-value {
    min-height: 32px;
    font-size: 9px;
  }

  .mobile-rule-setup > p {
    margin-top: 5px;
    padding: 5px;
    font-size: 8px;
  }

  .mobile-rule-target {
    min-height: 36px;
    margin-top: 5px;
    padding: 0 7px;
    font-size: 10px;
  }

  .mobile-rule-target select {
    min-height: 32px;
    font-size: 9px;
  }

  .mobile-rule-actions,
  .mobile-result-settings:not([hidden]) > .mobile-tool-actions,
  .mobile-custom-factors:not([hidden]) > .mobile-tool-actions,
  .mobile-advanced-rules:not([hidden]) > .mobile-tool-actions {
    position: fixed;
    z-index: 70;
    right: 8px;
    bottom: max(4px, env(safe-area-inset-bottom));
    left: 8px;
    gap: 6px;
    margin: 0;
    padding: 6px 0;
    background: linear-gradient(to bottom, rgba(7, 17, 30, 0.72), #07111e 28%);
    box-shadow: 0 -10px 22px rgba(3, 12, 21, 0.64);
  }

  .mobile-rule-actions button,
  .mobile-result-settings:not([hidden]) > .mobile-tool-actions button,
  .mobile-custom-factors:not([hidden]) > .mobile-tool-actions button,
  .mobile-advanced-rules:not([hidden]) > .mobile-tool-actions button {
    min-height: 42px;
    font-size: 13px;
  }

  /* M11: keep the expanded 5-day volume-ratio detail inside one viewport. */
  .mobile-factor-catalog:not([hidden]) {
    min-height: 100dvh;
    padding: 8px 8px 18px !important;
  }

  .mobile-tool-filters {
    gap: 5px;
    margin-top: 4px;
  }

  .mobile-tool-search,
  .mobile-tool-filters select {
    min-height: 36px;
    font-size: 10px;
  }

  .mobile-catalog-stats {
    gap: 5px;
    margin-top: 5px;
  }

  .mobile-catalog-stats article {
    grid-template-columns: 20px minmax(0, 1fr);
    grid-template-rows: 20px 15px;
    min-height: 48px;
    padding: 4px 5px;
  }

  .mobile-catalog-stats article > span,
  .mobile-catalog-stats strong {
    font-size: 15px;
  }

  .mobile-catalog-stats small {
    font-size: 8px;
  }

  .mobile-catalog-list {
    margin-top: 5px;
  }

  .mobile-catalog-list > header {
    min-height: 28px;
    padding: 0 6px;
    font-size: 8px;
  }

  .mobile-catalog-list > header,
  .mobile-catalog-row > button {
    grid-template-columns: minmax(0, 1.6fr) minmax(48px, .72fr) 32px 50px;
    gap: 3px;
  }

  #mobileCatalogRows {
    max-height: 548px;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
  }

  .mobile-catalog-row > button {
    min-height: 38px;
    padding: 4px 6px;
  }

  .mobile-catalog-row > button > strong {
    font-size: 11px;
  }

  .mobile-catalog-row > button > strong code,
  .mobile-catalog-row > button > span,
  .mobile-catalog-row > button > em {
    margin-top: 1px;
    font-size: 8px;
  }

  .mobile-catalog-detail {
    max-height: 258px;
    padding: 6px;
    overflow-y: auto;
    scrollbar-width: thin;
  }

  .mobile-catalog-detail dl {
    gap: 4px;
  }

  .mobile-catalog-detail dl > div {
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 5px;
    font-size: 9px;
    line-height: 1.35;
  }

  .mobile-catalog-example {
    gap: 2px;
    margin-top: 5px;
    padding: 5px;
    font-size: 8px;
  }

  .mobile-catalog-example strong {
    font-size: 9px;
  }

  .mobile-catalog-detail-actions {
    gap: 4px;
    margin-top: 5px;
  }

  .mobile-catalog-detail-actions button {
    min-height: 32px;
    font-size: 8px;
  }

  /* M12: compact result columns and preserve the data-operation section. */
  .mobile-settings-card {
    margin-top: 5px;
    padding: 6px;
  }

  .mobile-settings-card > header {
    min-height: 27px;
  }

  .mobile-settings-card h2 {
    font-size: 12px;
  }

  .mobile-settings-card header p,
  .mobile-settings-card header > span {
    font-size: 8px;
  }

  .mobile-column-list,
  .mobile-column-list.expanded {
    max-height: 244px;
    overflow-y: auto;
    scrollbar-width: thin;
  }

  .mobile-column-option {
    grid-template-columns: 18px 20px minmax(0, 1fr) auto;
    min-height: 24px;
    gap: 4px;
    padding: 0 5px;
    font-size: 9px;
  }

  .mobile-column-option input,
  .mobile-custom-factor-row input {
    width: 15px;
    height: 15px;
  }

  .mobile-column-option em,
  .mobile-column-option small {
    font-size: 7px;
  }

  .mobile-tool-more {
    min-height: 30px;
    font-size: 9px;
  }

  .mobile-column-preview {
    min-height: 38px;
    gap: 6px;
    margin-top: 4px;
    padding: 4px 5px;
    font-size: 7px;
  }

  .mobile-settings-toggle label {
    min-height: 42px;
    padding: 3px 5px;
  }

  .mobile-settings-toggle strong {
    font-size: 10px;
  }

  .mobile-settings-toggle small {
    margin-top: 2px;
    font-size: 7px;
  }

  .mobile-settings-coverage > div {
    gap: 4px;
    margin: 3px 0 4px;
    max-height: 72px;
    overflow-y: auto;
  }

  .mobile-settings-coverage article {
    grid-template-columns: minmax(0, 72px) minmax(0, 1fr) 36px auto;
    font-size: 8px;
  }

  .mobile-settings-coverage article strong,
  .mobile-settings-coverage article em {
    font-size: 8px;
  }

  .mobile-settings-coverage > button,
  .mobile-settings-data button {
    min-height: 32px;
    font-size: 9px;
  }

  .mobile-settings-data > div {
    gap: 5px;
    margin-top: 2px;
  }

  .mobile-settings-data p {
    margin-top: 3px;
    font-size: 7px;
  }

  /* M13: six real factor rows stay scrollable; preview remains visible. */
  .mobile-tool-tabs,
  .mobile-custom-view-tabs {
    gap: 4px;
    margin-top: 5px;
  }

  .mobile-tool-tabs button,
  .mobile-custom-view-tabs button {
    min-height: 34px;
    font-size: 11px;
  }

  .mobile-custom-factors > .mobile-tool-search {
    margin-top: 5px;
  }

  .mobile-custom-summary {
    min-height: 38px;
    margin-top: 5px;
    padding: 0 7px;
  }

  .mobile-custom-summary strong {
    font-size: 11px;
  }

  .mobile-custom-summary strong b {
    font-size: 16px;
  }

  .mobile-custom-summary span {
    font-size: 7px;
  }

  .mobile-custom-factor-list {
    max-height: none;
    margin-top: 5px;
    overflow: visible;
  }

  .mobile-custom-factor-list.expanded {
    max-height: none;
    overflow: visible;
  }

  .mobile-custom-factor-group > h3 {
    min-height: 28px;
    padding: 0 7px;
    font-size: 10px;
  }

  .mobile-custom-factor-row {
    grid-template-columns: 20px minmax(0, 1fr) auto 24px;
    min-height: 38px;
    gap: 4px;
    padding: 0 6px;
  }

  .mobile-custom-factor-row > button {
    min-height: 34px;
  }

  .mobile-custom-factor-row > button strong {
    font-size: 10px;
  }

  .mobile-custom-factor-row > button small,
  .mobile-custom-factor-row > span {
    margin-top: 1px;
    font-size: 7px;
  }

  .mobile-custom-factor-row > em {
    font-size: 14px;
  }

  .mobile-custom-selected-preview {
    margin-top: 5px;
    padding: 6px;
  }

  .mobile-custom-selected-preview > header {
    min-height: 26px;
  }

  .mobile-custom-selected-preview h2 {
    font-size: 11px;
  }

  .mobile-custom-selected-preview header span {
    font-size: 8px;
  }

  .mobile-custom-selected-preview > div button {
    min-height: 28px;
    padding: 0 6px;
    font-size: 8px;
  }

  .mobile-custom-selected-preview > article {
    min-height: 54px;
    max-height: 76px;
    margin-top: 4px;
    padding: 5px;
    overflow-y: auto;
    font-size: 8px;
    line-height: 1.35;
  }

  .mobile-custom-selected-preview > article strong {
    margin-bottom: 2px;
    font-size: 10px;
  }

  /* M16: large real rule sets stay intact inside bounded editors. */
  .mobile-advanced-rules {
    padding-bottom: 72px !important;
  }

  .mobile-advanced-card {
    margin-top: 4px;
    padding: 5px;
    border-radius: 7px;
  }

  .mobile-advanced-card > header {
    min-height: 28px;
    gap: 5px;
  }

  .mobile-advanced-card > header > b {
    width: 23px;
    height: 23px;
    font-size: 10px;
  }

  .mobile-advanced-card h2 {
    font-size: 12px;
  }

  .mobile-advanced-card header > select {
    min-height: 28px;
    max-width: 126px;
    font-size: 8px;
  }

  .mobile-advanced-scope {
    min-height: 34px;
  }

  .mobile-advanced-scope button {
    min-height: 32px;
    font-size: 9px;
  }

  .mobile-advanced-rule-block {
    margin-top: 4px;
    padding: 5px;
  }

  .mobile-advanced-rule-block > div {
    min-height: 27px;
  }

  .mobile-advanced-rule-block > div strong {
    font-size: 10px;
  }

  .mobile-advanced-rule-block > div span,
  .mobile-advanced-rule-block select {
    min-height: 28px;
    font-size: 8px;
  }

  #mobileAdvancedIncludeRules {
    max-height: 88px;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
  }

  .mobile-advanced-rule-row,
  .mobile-advanced-sort-row {
    grid-template-columns: 19px minmax(0, 1fr) minmax(104px, auto) 25px;
    min-height: 34px;
    gap: 3px;
    padding: 0 2px;
  }

  .mobile-advanced-rule-row > b,
  .mobile-advanced-sort-row > b {
    width: 17px;
    height: 17px;
    font-size: 8px;
  }

  .mobile-advanced-rule-row select,
  .mobile-advanced-rule-row input,
  .mobile-advanced-sort-row input,
  .mobile-advanced-sort-row select {
    min-height: 28px;
    padding: 0 3px;
    font-size: 7px;
  }

  .mobile-advanced-rule-row > em {
    grid-template-columns: minmax(62px, 1fr) minmax(45px, .75fr);
  }

  .mobile-advanced-rule-row > button,
  .mobile-advanced-sort-row > button {
    min-height: 28px;
    font-size: 14px;
  }

  .mobile-advanced-rule-block > button,
  .mobile-advanced-card > .mobile-tool-more {
    min-height: 28px;
    margin-top: 4px;
    font-size: 8px;
  }

  .mobile-advanced-excludes {
    flex-wrap: nowrap;
    gap: 4px;
    max-height: 30px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
  }

  .mobile-advanced-excludes button {
    min-height: 28px;
    flex: 0 0 auto;
    padding: 0 6px;
    font-size: 8px;
  }

  .mobile-advanced-sort-list {
    max-height: 74px;
    overflow-y: auto;
    scrollbar-width: thin;
  }

  .mobile-advanced-sort-row {
    grid-template-columns: 19px minmax(0, 1fr) minmax(70px, auto) 25px;
    min-height: 34px;
  }

  .mobile-advanced-vip {
    min-height: 30px;
    margin-top: 4px;
    padding: 0 6px;
    font-size: 8px;
  }

  .mobile-advanced-expression > header label {
    font-size: 7px;
  }

  .mobile-advanced-expression > label {
    grid-template-columns: 54px minmax(0, 1fr);
    gap: 4px;
    margin-top: 4px;
    font-size: 8px;
  }

  .mobile-advanced-expression textarea {
    min-height: 32px;
    padding: 4px;
    font-size: 8px;
  }

  .mobile-advanced-expression > p {
    margin-top: 4px;
    font-size: 8px;
  }
}

/* Keep feedback-v2 overrides last in the mobile cascade. */
@media (max-width: 767px) {
  .mobile-screener:not([hidden]) { position: relative; height: auto; min-height: 100dvh; padding-bottom: calc(82px + env(safe-area-inset-bottom)); overflow: visible; }
  .mobile-snapshot-row { grid-template-columns: repeat(2, minmax(0, 1fr)); height: auto; gap: 7px; padding-bottom: 7px; }
  .mobile-snapshot-row label { display: grid; grid-template-columns: auto minmax(0, 1fr); width: 100%; height: 36px; min-height: 36px; box-sizing: border-box; }
  .mobile-snapshot-row label > span, .mobile-snapshot-row select { min-width: 0; }
  .mobile-snapshot-row select { width: 100%; max-width: 100%; }
  .mobile-snapshot-row > small { grid-column: 1 / -1; grid-row: 2; justify-self: start; white-space: normal; }
  .mobile-current-strategy { height: auto; min-height: 58px; }
  .mobile-current-strategy { display: grid; grid-template-columns: minmax(0, 1fr) 158px; gap: 8px; }
  .mobile-current-strategy-copy { min-width: 0; width: 100%; }
  #mobileCurrentStrategySelect { width: 100%; max-width: 100%; min-width: 0; min-height: 28px; margin-top: 2px; padding: 0 26px 0 7px; border: 1px solid var(--m-line); border-radius: 6px; background: #091827; color: #f0f4f8; font-size: 12px; font-weight: 700; }
  .mobile-strategy-links { width: 100%; min-width: 0; }
  .mobile-condition-summary { height: auto; min-height: 62px; align-items: start; }
  .mobile-condition-chips { display: flex; flex-wrap: wrap; max-height: none; overflow: visible; }
  .mobile-condition-chips > span { width: auto; }
  .mobile-result-section { position: static; width: auto; height: auto; margin-top: 18px; overflow: visible; }
  .mobile-result-list { height: auto; max-height: none; overflow: visible; }
  .mobile-result-columns,
  .mobile-result-card,
  .mobile-result-card.top-ranked {
    display: grid;
    grid-template-columns: 22px minmax(64px, 1.5fr) 40px 42px 46px minmax(38px, 1fr) 38px;
    grid-template-areas: "rank identity pct vr amount industry action";
    align-items: center;
    gap: 3px;
  }
  .mobile-result-columns {
    min-height: 28px;
    /* Match each result card's 1px border + 6px inner padding. */
    padding: 0 7px;
    color: var(--m-muted);
    font-size: 8px;
    line-height: 1.15;
    text-align: center;
    white-space: nowrap;
  }
  .mobile-result-columns > span:nth-child(1) { grid-area: rank; }
  .mobile-result-columns > span:nth-child(2) { grid-area: identity; text-align: left; }
  .mobile-result-columns > span:nth-child(3) { grid-area: pct; }
  .mobile-result-columns > span:nth-child(4) { grid-area: vr; }
  .mobile-result-columns > span:nth-child(5) { grid-area: amount; }
  .mobile-result-columns > span:nth-child(6) { grid-area: industry; }
  .mobile-result-columns > span:nth-child(7) { grid-area: action; }
  .mobile-result-card,
  .mobile-result-card.top-ranked {
    min-height: 68px;
    height: 68px;
    padding: 7px 6px;
    border: 1px solid var(--m-line-soft);
    border-radius: 8px;
    background: rgba(9, 24, 38, .72);
  }
  .mobile-result-card + .mobile-result-card { margin-top: 6px; }
  .mobile-result-card.top-ranked {
    border-color: rgba(255, 176, 32, .52);
    background: linear-gradient(100deg, rgba(63, 45, 18, .42), rgba(12, 27, 40, .92));
  }
  .mobile-result-card .mobile-rank-badge {
    position: static;
    grid-area: rank;
    width: 100%;
    height: 28px;
    border: 0;
    border-radius: 5px;
    background: transparent;
    color: transparent;
    font-size: 7px;
  }
  .mobile-result-card .mobile-rank-badge.is-first {
    border: 1px solid rgba(255, 176, 32, .62);
    background: rgba(72, 49, 16, .72);
    color: var(--m-amber);
    font-weight: 800;
  }
  .mobile-result-card.top-ranked .mobile-stock-identity { padding-left: 0; }
  .mobile-stock-identity { grid-area: identity; min-width: 0; }
  .mobile-stock-identity a {
    overflow: hidden;
    font-size: 12px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .mobile-stock-identity .mobile-stock-code {
    display: block !important;
    margin-top: 5px;
    overflow: hidden;
    color: var(--m-muted);
    font-size: 8px;
    line-height: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .mobile-stock-metrics { display: contents; }
  .mobile-stock-metrics > div { min-width: 0; text-align: center; }
  .mobile-stock-metrics > div:nth-child(1) { grid-area: pct; }
  .mobile-stock-metrics > div:nth-child(2) { grid-area: vr; }
  .mobile-stock-metrics > div:nth-child(3) { grid-area: amount; }
  .mobile-stock-metrics > div:nth-child(4) { grid-area: industry; }
  .mobile-stock-metrics span { display: none; }
  .mobile-stock-metrics strong {
    display: block;
    margin: 0;
    overflow: hidden;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.15;
    overflow-wrap: normal;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .mobile-stock-metrics strong.positive { color: var(--m-up); }
  .mobile-stock-metrics strong.negative { color: var(--m-down); }
  .mobile-stock-industry strong { font-size: 9px; white-space: nowrap; }
  .mobile-screener .mobile-result-card .mobile-add-holding {
    grid-area: action;
    width: 100%;
    min-width: 0;
    height: 32px;
    min-height: 34px;
    padding: 0 3px;
    font-size: 10px;
    line-height: 1.15;
    white-space: nowrap;
  }
  .mobile-result-tools { display: none !important; }
  .mobile-rule-factor-list,
  #mobileCatalogRows {
    max-height: none !important;
    overflow: visible !important;
    overscroll-behavior: auto;
  }
  .mobile-snapshot-row label,
  .mobile-workspace-snapshot label {
    position: relative;
    overflow: hidden;
  }
  .mobile-snapshot-row select,
  .mobile-workspace-snapshot select {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100%;
    min-width: 0;
    padding-right: 18px !important;
    border: 0 !important;
    border-radius: 0 !important;
    outline: 0;
    appearance: none !important;
    -webkit-appearance: none !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #dbe6ef !important;
  }
  .mobile-snapshot-row label::after,
  .mobile-workspace-snapshot label::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 8px;
    z-index: 2;
    width: 6px;
    height: 6px;
    border: 0;
    border-right: 1px solid #8ea3b6;
    border-bottom: 1px solid #8ea3b6;
    pointer-events: none;
    transform: translateY(-68%) rotate(45deg);
  }
  .mobile-browser-boundary { position: static; width: auto; height: auto; margin: 12px 0 0; line-height: 1.5; white-space: normal; }
  .mobile-load-more:not([hidden]) { display: block; width: 100%; min-height: 42px; margin-top: 10px; }
  .mobile-workspace-section > header { flex-wrap: wrap; }
  .mobile-workspace-collapse { min-height: 30px; margin-left: auto; padding: 0 8px; border: 1px solid rgba(54, 215, 192, .55); border-radius: 6px; background: rgba(7, 62, 69, .28); color: var(--m-primary); font-size: 10px; white-space: nowrap; }
  .mobile-workspace-rule-list, .mobile-workspace-chips, .mobile-workspace-sort-list { max-height: none; overflow: visible; }
  .mobile-workspace-chips { flex-wrap: wrap; }
  .mobile-workspace-section.collapsed > :not(header) { display: none !important; }
  .mobile-workspace-actions { position: sticky; right: auto; bottom: 0; left: auto; margin: 12px 0 0; }
  .mobile-strategy-card { cursor: pointer; transition: border-color .16s ease, background .16s ease; }
  .mobile-strategy-card > footer { align-items: center; flex-wrap: wrap; }
  .mobile-strategy-card > footer > div { flex: 1 1 100%; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; }
  .mobile-strategy-card > footer button.notification-subscription-btn { grid-column: 1 / -1; }
  .mobile-strategy-card > footer button { min-width: 0; padding: 0 4px; border: 1px solid var(--m-line-soft); border-radius: 5px; font-size: 9px; }
  .mobile-strategy-card > footer button[data-mobile-load-task] { border-color: rgba(54, 215, 192, .75); background: rgba(11, 111, 111, .34); color: #65ead7; font-weight: 750; }
  .mobile-strategy-card > footer button[data-mobile-edit-task] { border-color: rgba(66, 145, 214, .62); background: rgba(29, 79, 121, .28); color: #b9dcff; }
}

/* Keep full-audit interaction overrides last in the mobile cascade. */
@media (max-width: 767px) {
  .mobile-help-btn { width: 40px; height: 40px; min-width: 40px; min-height: 40px; }
  .mobile-snapshot-row label, .mobile-workspace-snapshot label { height: 40px; min-height: 40px; }
  #mobileCurrentStrategySelect,
  .mobile-strategy-links button,
  .mobile-strategy-links a,
  .mobile-condition-tabs button,
  .mobile-edit-conditions,
  .mobile-workspace-rule > button,
  .mobile-workspace-inline-add button,
  .mobile-workspace-group-actions button,
  .mobile-workspace-collapse,
  .mobile-strategy-card > footer button { min-height: 40px; }
  .mobile-strategy-links { flex-basis: 158px; }
  .mobile-workspace-rule { grid-template-columns: 16px minmax(70px, 1fr) minmax(42px, auto) minmax(42px, 70px) 40px 40px; }
  .mobile-workspace-rule > button { width: 40px; min-width: 40px; padding: 0; }
}

@media (max-width: 340px) {
  .mobile-workspace-section > header {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) auto;
    gap: 6px;
  }
  .mobile-workspace-section > header > h2 {
    overflow: hidden;
    font-size: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .mobile-workspace-section > header > .mobile-workspace-collapse { grid-column: 3; grid-row: 1; }
  .mobile-workspace-section > header > select,
  .mobile-workspace-section > header > span { width: 100%; max-width: none; grid-column: 2 / 4; grid-row: 2; }
  .mobile-workspace-rule { grid-template-columns: 14px minmax(58px, 1fr) minmax(38px, auto) minmax(40px, 58px) 36px 36px; gap: 2px; }
  .mobile-workspace-rule > button { width: 36px; min-width: 36px; }
  .mobile-factor-tier-row { grid-template-columns: 1fr; align-items: stretch; }
  .mobile-factor-tier-row .mobile-factor-tier { display: grid; grid-template-columns: 58px minmax(0, 1fr); min-height: 40px; gap: 5px; }
  .mobile-factor-tier-row .mobile-factor-tier select { width: 100%; min-width: 0; }
  .mobile-factor-tier-row .mobile-workspace-tool-link { width: 100%; margin: 0; }
}

/* Keep tutorial entry and page geometry after the legacy compact overrides. */
@media (max-width: 767px) {
  .mobile-help-btn.mobile-video-tutorial-btn {
    display: flex;
    width: 106px;
    min-width: 106px;
    height: 42px;
    min-height: 42px;
    padding: 0 10px 0 8px;
    border: 1px solid rgba(91, 203, 255, .95);
    border-radius: 8px;
    background: linear-gradient(145deg, #25b4ff 0%, #1984ee 48%, #315bea 100%);
    box-shadow: 0 0 0 1px rgba(71, 189, 255, .18), 0 6px 16px rgba(14, 103, 221, .45), inset 0 1px rgba(255, 255, 255, .28);
    color: #fff;
    font-size: 11px;
  }

  .mobile-flow-page.mobile-tutorial-library:not([hidden]) {
    min-height: 100dvh;
    padding: 8px 10px 92px;
  }

  html.tutorial-onboarding-open,
  html.tutorial-onboarding-open body {
    overflow: hidden !important;
    overscroll-behavior: none;
  }
}

/* Compact VIP previous-result row: directly below the completed selection summary. */
@media (max-width: 767px) {
  .mobile-vip-daily-outcome {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr) 56px 76px;
    min-height: 72px;
    align-items: stretch;
    gap: 7px;
    box-sizing: border-box;
    margin: 12px 0 0;
    padding: 8px;
    border: 1px solid rgba(255, 176, 32, .5);
    border-radius: 7px;
    background: linear-gradient(145deg, rgba(45, 34, 10, .94), rgba(10, 24, 34, .98));
    box-shadow: 0 5px 14px rgba(0, 0, 0, .18);
  }

  .mobile-vip-daily-outcome[hidden] { display: none !important; }

  .mobile-vip-daily-label,
  .mobile-vip-daily-result {
    display: flex;
    min-width: 0;
    flex-direction: column;
    justify-content: center;
  }

  .mobile-vip-daily-label { gap: 5px; }

  .mobile-vip-daily-label b {
    display: inline-grid;
    width: 32px;
    height: 20px;
    place-items: center;
    border: 1px solid rgba(255, 196, 55, .72);
    border-radius: 4px;
    background: rgba(141, 92, 0, .42);
    color: #ffc72c;
    font-size: 10px;
  }

  .mobile-vip-daily-label strong {
    color: #ffd05a;
    font-size: 11px;
    white-space: nowrap;
  }

  .mobile-vip-daily-result {
    gap: 2px;
    padding-left: 7px;
    border-left: 1px solid rgba(255, 255, 255, .08);
  }

  .mobile-vip-daily-result span {
    color: #93a8ba;
    font-size: 9px;
  }

  .mobile-vip-daily-result strong {
    overflow: hidden;
    color: #f4f8fb;
    font-size: 12px;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .mobile-vip-daily-result em {
    color: #71889b;
    font-size: 9px;
    font-style: normal;
  }

  .mobile-vip-daily-today strong {
    display: inline-flex;
    width: 46px;
    height: 24px;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 190, 55, .52);
    border-radius: 4px;
    background: rgba(106, 69, 0, .26);
    color: #ffd05a;
    font-size: 11px;
  }

  .mobile-vip-daily-today strong[data-state="extend_t2"] {
    border-color: rgba(48, 214, 155, .55);
    background: rgba(17, 105, 74, .4);
    color: #63e4b1;
  }

  .mobile-vip-daily-today strong[data-state="sell"] {
    border-color: rgba(255, 90, 103, .58);
    background: rgba(126, 25, 33, .45);
    color: #ff7d86;
  }

  .mobile-vip-daily-today strong[data-state="not_applicable"],
  .mobile-vip-daily-today strong[data-state="unavailable"] {
    border-color: rgba(126, 147, 166, .45);
    background: rgba(51, 66, 80, .42);
    color: #a8b7c4;
  }

  .mobile-vip-daily-detail {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: center;
    gap: 3px;
    border: 1px solid rgba(255, 190, 55, .56);
    border-radius: 5px;
    background: rgba(106, 69, 0, .28);
    color: #ffd05a;
    font-size: 11px;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
  }

  .mobile-vip-daily-detail[hidden] { display: none !important; }
  .mobile-vip-daily-detail b { font-size: 15px; }
}

@media (max-width: 340px) {
  .mobile-vip-daily-outcome {
    grid-template-columns: 56px minmax(0, 1fr) 52px 68px;
    gap: 5px;
    padding: 7px;
  }

  .mobile-vip-daily-detail { font-size: 10px; }
}