/* Phone pages added for App parity: search, 自選群組, 分點警示, 每日探索. */
.mm-group-tabs,
.mm-alerts-panel,
.mm-summary-row,
.mm-add-stock-row,
.mm-group-notes {
  display: none;
}

/* broker-page.js injects these on every width; only the phone layout styles them. */
@media (min-width: 641px) {
  .mm-broker-tabs,
  .mm-broker-filter,
  .mm-broker-meta {
    display: none;
  }
}

@media (max-width: 640px) {
  /* ---------- Full-page stock search (App §27) ---------- */
  .mm-search-panel {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    margin: 0 calc(var(--mm-gutter) * -1);
    padding-top: 12px;
  }

  .mm-search-field {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 44px;
    margin: 0 var(--mm-gutter) 8px;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel-soft);
    color: var(--muted);
  }

  .mm-search-field > svg {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
  }

  .mm-search-field input {
    flex: 1 1 auto;
    min-width: 0;
    height: 100%;
    padding: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--text);
    font: inherit;
    font-size: 16px;
  }

  .mm-search-field input::-webkit-search-cancel-button {
    display: none;
  }

  .mm-search-clear {
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--faint);
  }

  .mm-search-clear svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.2;
    stroke-linecap: round;
  }

  .mm-search-clear[hidden] {
    display: none;
  }

  .mm-search-results {
    flex: 1 1 auto;
  }

  .mm-search-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px var(--mm-gutter) 6px;
    color: var(--faint);
    font-size: 12px;
    font-weight: 700;
  }

  .mm-search-section button {
    min-height: 32px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
  }

  .mm-search-row {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 52px;
    padding: 0 var(--mm-gutter);
    border-top: 1px solid var(--line-soft);
  }

  .mm-search-row.is-link {
    cursor: pointer;
  }

  .mm-search-row.is-link:active {
    background: var(--panel-soft);
  }

  .mm-search-recent-icon {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    fill: none;
    stroke: var(--faint);
    stroke-width: 1.8;
    stroke-linecap: round;
  }

  .mm-search-name {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    color: var(--text);
    font-size: 15px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mm-search-name .num {
    font-weight: 800;
  }

  .mm-search-hint {
    margin: 0;
    padding: 28px 16px;
    color: var(--faint);
    font-size: 13px;
    text-align: center;
  }

  .mm-search-footer:empty {
    display: none;
  }

  .mm-search-footer {
    padding: 0 var(--mm-gutter);
  }

  .mm-star-button {
    position: relative;
    display: inline-grid;
    place-items: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--muted);
  }

  .mm-star-button::after {
    position: absolute;
    inset: -10px;
    content: "";
  }

  .mm-star-button svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linejoin: round;
  }

  .mm-star-button.is-starred {
    color: var(--accent);
  }

  .mm-star-button.is-starred svg {
    fill: currentColor;
  }

  .mm-add-button {
    min-width: 72px;
    min-height: 32px;
    padding: 0 10px;
    border: 1px solid var(--accent);
    border-radius: 6px;
    background: transparent;
    color: var(--accent);
    font-size: 13px;
    font-weight: 700;
  }

  .mm-add-button:disabled {
    opacity: 0.4;
  }

  .mm-added {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    color: var(--accent);
    font-size: 13px;
    font-weight: 700;
  }

  .mm-added svg {
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.4;
  }

  /* ---------- 自選 page (App §26, §32) ---------- */
  #viewMarketSearch .watch-panel-head {
    display: none;
  }

  #viewMarketSearch #wsListPanel {
    padding: 0;
  }

  #viewMarketSearch .ws-row {
    width: calc(100% + var(--mm-gutter) * 2);
    max-width: none;
    margin-inline: calc(var(--mm-gutter) * -1);
    padding-inline: var(--mm-gutter);
    border-radius: 0;
  }

  body.mm-groups-active .mm-group-tabs {
    display: flex;
    align-items: center;
    margin: 0 calc(var(--mm-gutter) * -1);
    border-bottom: 1px solid var(--line-soft);
  }

  .mm-group-tab-scroll {
    display: flex;
    flex: 1 1 auto;
    gap: 18px;
    min-width: 0;
    padding: 0 var(--mm-gutter);
    overflow-x: auto;
    scrollbar-width: none;
  }

  .mm-group-tab-scroll::-webkit-scrollbar {
    display: none;
  }

  .mm-group-tab-scroll > button {
    flex: 0 0 auto;
    height: 44px;
    margin-bottom: -1px;
    padding: 0;
    border: 0;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: var(--muted);
    font-size: 15px;
    font-weight: 700;
    white-space: nowrap;
  }

  .mm-group-tab-scroll > button .num {
    font-size: 13px;
    font-weight: 800;
  }

  .mm-group-tab-scroll > button.is-active {
    border-bottom-color: var(--accent);
    color: var(--accent);
  }

  .mm-group-manage {
    flex: 0 0 auto;
    color: var(--muted);
  }

  .mm-group-manage svg {
    fill: currentColor;
    stroke: none;
  }

  body.mm-alerts-tab #wsPanel {
    display: none;
  }

  /* 個股詳情是獨立頁面：自選群組分頁與分點警示不應出現在頂欄上方。 */
  body.mm-detail-open .mm-group-tabs,
  body.mm-detail-open .mm-alerts-panel {
    display: none !important;
  }

  body.mm-detail-open.mm-alerts-tab #wsPanel {
    display: grid;
  }

  body.mm-groups-active .mm-alerts-panel:not([hidden]) {
    display: block;
  }

  .mm-summary-row:not([hidden]) {
    display: flex;
    align-items: center;
    gap: 10px;
    width: calc(100% + var(--mm-gutter) * 2);
    min-height: 52px;
    margin: 0 calc(var(--mm-gutter) * -1);
    padding: 0 var(--mm-gutter);
    border: 0;
    border-bottom: 1px solid var(--line-soft);
    background: transparent;
    color: var(--text);
    text-align: left;
  }

  .mm-summary-row:active {
    background: var(--accent-soft);
  }

  .mm-summary-icon {
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    width: 28px;
    height: 28px;
    border: 1px solid color-mix(in srgb, var(--accent) 35%, transparent);
    border-radius: 8px;
    background: var(--accent-soft);
    color: var(--accent);
    font-size: 13px;
  }

  .mm-summary-copy {
    display: grid;
    flex: 1 1 auto;
    min-width: 0;
  }

  .mm-summary-copy strong {
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
  }

  .mm-summary-copy small {
    color: var(--muted);
    font-size: 11.5px;
    line-height: 16px;
  }

  .mm-summary-chevron svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: var(--muted);
    stroke-width: 2;
  }

  /* The old right-edge drawer is replaced by the 今日總整理 row. */
  .summary-drawer,
  .summary-backdrop {
    display: none !important;
  }

  .mm-summary-meta {
    margin: 12px 0 4px;
    color: var(--muted);
    font-size: 12px;
  }

  body.mm-groups-active .mm-add-stock-row:not([hidden]),
  .mm-alert-add {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: calc(100% + var(--mm-gutter) * 2);
    min-height: 48px;
    margin: 0 calc(var(--mm-gutter) * -1);
    border: 0;
    border-top: 1px solid var(--line-soft);
    background: transparent;
    color: var(--accent);
    font-size: 14px;
    font-weight: 700;
  }

  .mm-add-stock-row svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
  }

  .mm-add-stock-row .num {
    color: var(--faint);
    font-size: 12px;
    font-weight: 800;
  }

  .mm-alert-add:disabled {
    opacity: 0.45;
  }

  .mm-group-notes {
    display: block;
  }

  .mm-note {
    margin: 8px 0 0;
    color: var(--faint);
    font-size: 12px;
    line-height: 18px;
  }

  .mm-note.is-warning {
    color: #f1b458;
  }

  body:not(.dark-mode) .mm-note.is-warning {
    color: #b97112;
  }

  .mm-note.is-error,
  .mm-sheet-hint.is-error {
    color: #ff7777;
  }

  body:not(.dark-mode) .mm-note.is-error,
  body:not(.dark-mode) .mm-sheet-hint.is-error {
    color: #d44545;
  }

  .mm-pro-gate {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 12px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--accent-soft);
  }

  .mm-pro-gate p {
    flex: 1 1 auto;
    margin: 0;
    color: var(--text);
    font-size: 12.5px;
    line-height: 19px;
  }

  .mm-link-button {
    min-height: 44px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--accent);
    font-size: 13px;
    font-weight: 700;
  }

  /* Sheets: group picker, name, alert editor. */
  .mm-sheet-hint {
    margin: 0 0 8px;
    color: var(--faint);
    font-size: 12px;
    line-height: 18px;
  }

  .mm-check-list {
    margin-bottom: 8px;
  }

  .mm-check-row {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-height: 48px;
    padding: 0;
    border: 0;
    border-top: 1px solid var(--line-soft);
    background: transparent;
    color: var(--text);
    text-align: left;
  }

  .mm-check-row.is-add {
    color: var(--accent);
  }

  .mm-check-row.is-add svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
  }

  .mm-check-row:disabled {
    opacity: 0.45;
  }

  .mm-checkbox {
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    width: 20px;
    height: 20px;
    border: 1.6px solid var(--muted);
    border-radius: 4px;
    color: var(--accent-ink);
  }

  .mm-checkbox.is-checked {
    border-color: var(--accent);
    background: var(--accent);
  }

  .mm-checkbox svg {
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
    stroke-width: 3;
  }

  .mm-check-name {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    font-size: 15px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mm-check-count {
    color: var(--faint);
    font-size: 12px;
  }

  .mm-primary-button {
    width: 100%;
    height: 44px;
    margin-top: 4px;
    border: 0;
    border-radius: 8px;
    background: var(--accent);
    color: var(--accent-ink);
    font-size: 15px;
    font-weight: 800;
  }

  .mm-primary-button:disabled {
    opacity: 0.6;
  }

  .mm-text-input {
    width: 100%;
    height: 44px;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    outline: 0;
    background: var(--bg);
    color: var(--text);
    font: inherit;
    font-size: 16px;
  }

  .mm-text-input.is-focus,
  .mm-text-input:focus {
    border-color: var(--accent);
  }

  .mm-text-input.is-error {
    border-color: #ff7777;
  }

  .mm-name-form {
    display: grid;
    gap: 10px;
    padding-top: 4px;
  }

  .mm-name-form .mm-sheet-hint {
    margin: 0;
  }

  /* 管理群組 */
  .mm-manage-screen .mm-screen-body {
    padding-inline: 0;
  }

  .mm-manage-list {
    position: relative;
  }

  .mm-manage-row {
    position: relative;
    display: flex;
    align-items: center;
    gap: 4px;
    width: 100%;
    height: 60px;
    padding: 0 8px 0 0;
    border: 0;
    border-bottom: 1px solid var(--line-soft);
    background: var(--bg);
    color: var(--text);
    transition: transform 160ms ease;
  }

  .mm-manage-row.is-dragging {
    z-index: 2;
    background: var(--panel-soft);
    transition: none;
  }

  .mm-manage-row.is-add {
    gap: 12px;
    padding: 0 16px;
    color: var(--accent);
    text-align: left;
  }

  .mm-manage-row.is-add svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
  }

  .mm-manage-row.is-add:disabled {
    opacity: 0.45;
  }

  .mm-drag-handle {
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    width: 48px;
    height: 60px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--muted);
    cursor: grab;
    touch-action: none;
  }

  .mm-drag-handle svg,
  .mm-manage-row .mm-icon-button svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .mm-manage-text {
    display: grid;
    flex: 1 1 auto;
    gap: 2px;
    min-width: 0;
  }

  .mm-manage-text strong {
    overflow: hidden;
    font-size: 15px;
    line-height: 22px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mm-manage-text small {
    color: var(--faint);
    font-size: 12px;
  }

  .mm-icon-button.is-muted {
    color: var(--muted);
  }

  .mm-manage-screen .mm-note,
  .mm-manage-screen .mm-link-button {
    padding: 0 16px;
  }

  .mm-manage-screen .mm-note {
    padding-top: 6px;
  }

  /* ---------- 分點警示 panel ---------- */
  .mm-section-head {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 44px;
    margin-top: 4px;
  }

  .mm-section-mark {
    width: 3px;
    height: 16px;
    background: var(--accent);
  }

  .mm-section-head h2 {
    margin: 0;
    color: var(--text);
    font-size: 16px;
    font-weight: 800;
  }

  .mm-count-pill {
    padding: 1px 9px;
    border-radius: 999px;
    background: var(--accent-soft);
    color: var(--accent);
    font-size: 12px;
    font-weight: 800;
  }

  .mm-pro-tag {
    padding: 0 5px;
    border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent);
    border-radius: 4px;
    color: var(--accent);
    font-family: "Manrope", sans-serif;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.4px;
  }

  .mm-section-date {
    flex: 1 1 auto;
    color: var(--muted);
    font-size: 11px;
    text-align: right;
  }

  .mm-empty-line {
    margin: 0;
    padding: 16px 0;
    border-top: 1px solid var(--line-soft);
    color: var(--muted);
    font-size: 12.5px;
    line-height: 19px;
  }

  .mm-alert-gate {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--accent-soft);
  }

  .mm-alert-gate div {
    flex: 1 1 auto;
  }

  .mm-alert-gate .mm-button,
  .mm-pro-gate .mm-button {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .mm-alert-gate p {
    margin: 0;
    color: var(--text);
    font-size: 12.5px;
    line-height: 19px;
  }

  .mm-alert-gate small {
    color: var(--muted);
    font-size: 12px;
  }

  .mm-alert-row {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 60px;
    padding: 8px 0;
    border: 0;
    border-top: 1px solid var(--line-soft);
    background: transparent;
    color: var(--text);
    text-align: left;
  }

  .mm-alert-row.is-paused {
    opacity: 0.5;
  }

  .mm-alert-bell svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: var(--faint);
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .mm-alert-bell.is-on svg {
    stroke: var(--accent);
  }

  .mm-alert-main {
    display: grid;
    flex: 1 1 auto;
    min-width: 0;
  }

  .mm-alert-main strong {
    overflow: hidden;
    font-size: 14px;
    line-height: 20px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mm-alert-main strong .num {
    color: var(--muted);
    font-size: 12px;
  }

  .mm-alert-main small {
    margin-top: 2px;
    color: var(--muted);
    font-size: 12px;
  }

  .mm-alert-main small b {
    color: var(--text);
  }

  .mm-alert-status {
    display: flex;
    flex: 0 0 96px;
    justify-content: flex-end;
  }

  .mm-status-badge {
    padding: 1px 8px;
    border: 1px dashed var(--line);
    border-radius: 999px;
    color: var(--faint);
    font-size: 12px;
    font-weight: 800;
    line-height: 18px;
  }

  .mm-status-badge.is-paused {
    border-style: solid;
    color: var(--muted);
  }

  .mm-alert-status.has-result {
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
  }

  .mm-status-badge.is-hit {
    border-style: solid;
    border-color: var(--accent);
    background: var(--accent-soft);
    color: var(--accent);
  }

  .mm-status-badge.is-miss,
  .mm-status-badge.is-none {
    border-style: solid;
    color: var(--muted);
  }

  .mm-alert-result {
    color: var(--muted);
    font-size: 11px;
    line-height: 16px;
    white-space: nowrap;
  }

  .mm-alert-push-note {
    margin: 10px 0 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 18px;
  }

  .mm-alert-form {
    padding-bottom: 4px;
  }

  .mm-field-label {
    display: block;
    margin: 12px 0 6px;
    color: var(--muted);
    font-size: 12px;
    line-height: 18px;
  }

  .mm-options {
    margin-top: 6px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 8px;
  }

  .mm-options[hidden] {
    display: none;
  }

  .mm-option {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: 44px;
    padding: 0 12px;
    border: 0;
    border-top: 1px solid var(--line-soft);
    background: transparent;
    color: var(--text);
    text-align: left;
  }

  .mm-option:first-child {
    border-top: 0;
  }

  .mm-option span {
    flex: 1 1 auto;
    font-size: 14px;
    font-weight: 700;
  }

  .mm-option small {
    color: var(--muted);
    font-size: 11px;
  }

  .mm-fill-seg {
    height: 44px;
    padding: 4px;
    border-radius: 12px;
    background: var(--seg-bg);
  }

  .mm-fill-seg .seg-item {
    border: 0;
    color: var(--muted);
    font-size: 15px;
    font-weight: 700;
  }

  .mm-fill-seg .seg-item.is-active {
    color: var(--accent-ink);
  }

  .mm-threshold {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 44px;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--bg);
    color: var(--muted);
    font-size: 13px;
  }

  .mm-threshold input {
    flex: 1 1 auto;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--text);
    font-size: 16px;
    font-weight: 700;
  }

  .mm-presets {
    display: flex;
    gap: 8px;
    margin-top: 8px;
  }

  .mm-presets button {
    min-width: 56px;
    height: 36px;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: transparent;
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
  }

  .mm-presets button.is-active {
    border-color: var(--accent);
    background: var(--accent-soft);
    color: var(--accent);
  }

  .mm-notify-row {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 56px;
    margin-top: 14px;
    border-top: 1px solid var(--line-soft);
  }

  .mm-notify-row > span {
    display: grid;
    flex: 1 1 auto;
  }

  .mm-notify-row strong {
    color: var(--text);
    font-size: 14px;
  }

  .mm-notify-row small {
    color: var(--muted);
    font-size: 12px;
    line-height: 18px;
  }

  .mm-switch {
    position: relative;
    flex: 0 0 auto;
    width: 44px;
    height: 26px;
    margin: 0;
    border-radius: 13px;
    background: var(--line);
    appearance: none;
    cursor: pointer;
    transition: background 160ms ease;
  }

  .mm-switch::after {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #fff;
    content: "";
    transition: transform 160ms ease;
  }

  .mm-switch:checked {
    background: var(--accent);
  }

  .mm-switch:checked::after {
    transform: translateX(18px);
  }

  .mm-alert-sentence {
    margin: 8px 0 10px;
    color: var(--muted);
    font-size: 12px;
    line-height: 18px;
  }

  .mm-danger-link {
    width: 100%;
    height: 44px;
    margin-top: 6px;
    border: 0;
    background: transparent;
    color: #ff7777;
    font-size: 14px;
    font-weight: 700;
  }

  /* ---------- 分點分析 (App §29) ---------- */
  #viewBrokerBranch .mm-broker-tabs {
    display: flex;
  }

  #viewBrokerBranch:has(#bbProtectedContent[hidden]) .mm-broker-tabs {
    display: none;
  }

  body.mm-broker-tab-positions #viewBrokerBranch .bb-analysis-card,
  body.mm-broker-tab-capability #viewBrokerBranch .bb-holdings-card {
    display: none !important;
  }

  #viewBrokerBranch .bb-dashboard-grid {
    display: block;
    margin-top: 0;
  }

  #viewBrokerBranch .bb-holdings-card,
  #viewBrokerBranch .bb-analysis-card {
    margin: 0;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  #viewBrokerBranch .bb-holdings-card > .bb-section-head,
  #viewBrokerBranch .bb-position-scroll-hint {
    display: none !important;
  }

  #viewBrokerBranch .bb-analysis-card {
    padding-top: 12px !important;
  }

  #viewBrokerBranch #bbPositionsControls:not([hidden]) {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    gap: 4px;
    margin-top: 12px;
  }

  #viewBrokerBranch #bbPositionsControls > label:first-child {
    display: block;
    flex: 1 1 auto;
    min-width: 0;
  }

  #viewBrokerBranch #bbPositionsControls > label:not(:first-child),
  #viewBrokerBranch #bbPositionsControls .bb-control-label {
    display: none !important;
  }

  #viewBrokerBranch #bbPositionSearch {
    width: 100%;
    height: 40px;
    padding: 0 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel-soft);
    color: var(--text);
    font-size: 16px;
  }

  .mm-broker-filter {
    flex: 0 0 auto;
    color: var(--muted);
  }

  .mm-broker-filter.is-changed {
    color: var(--accent);
  }

  .mm-broker-filter svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
  }

  .mm-broker-meta {
    margin: 6px 0 8px;
    color: var(--faint);
    font-size: 12px;
    line-height: 18px;
  }

  .mm-position-row {
    margin: 0 calc(var(--mm-gutter) * -1);
    padding: 10px var(--mm-gutter);
    border-top: 1px solid var(--line-soft);
    cursor: pointer;
  }

  .mm-position-row.is-open,
  .mm-position-row:active {
    background: var(--panel-soft);
  }

  .mm-position-line {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
  }

  .mm-position-name {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    color: var(--text);
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mm-position-name .num,
  .mm-position-line strong.num {
    font-weight: 800;
  }

  .mm-position-line strong.num {
    color: var(--text);
    font-size: 15px;
    line-height: 20px;
  }

  .mm-position-line.is-meta {
    margin-top: 3px;
    color: var(--faint);
    font-size: 12px;
    line-height: 18px;
  }

  .mm-position-line.is-meta span:first-child {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mm-position-track {
    display: block;
    height: 2px;
    margin-top: 6px;
    overflow: hidden;
    border-radius: 1px;
    background: var(--line-soft);
  }

  .mm-position-track span {
    display: block;
    height: 2px;
    border-radius: 1px;
    background: var(--accent);
    opacity: 0.75;
  }

  .mm-position-line.is-detail {
    align-items: center;
    margin-top: 6px;
    color: var(--muted);
    font-size: 12px;
    line-height: 18px;
  }

  .mm-position-line.is-detail a {
    min-height: 24px;
    color: var(--muted);
    text-decoration: none;
  }

  .mm-position-count {
    margin: 0 calc(var(--mm-gutter) * -1);
    padding: 10px var(--mm-gutter);
    border-top: 1px solid var(--line-soft);
    color: var(--faint);
    font-size: 12px;
  }

  .mm-filter-title {
    margin: 12px 0 4px;
    color: var(--faint);
    font-size: 12px;
    font-weight: 700;
  }

  .mm-filter-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 48px;
    padding: 0;
    border: 0;
    border-top: 1px solid var(--line-soft);
    background: transparent;
    color: var(--text);
    font-size: 15px;
    text-align: left;
  }

  .mm-filter-row.is-checked {
    color: var(--accent);
  }

  .mm-filter-row svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.4;
  }

  .mm-filter-sheet .mm-primary-button {
    margin-top: 12px;
  }

  /* ---------- Floating bell and check-in toast (App §39) ---------- */
  .market-notification-bell.has-unread[aria-expanded="false"] > svg {
    animation: none !important;
  }

  .market-notification-bell.has-unread.is-nudging[aria-expanded="false"] > svg {
    transform-origin: 50% 18%;
    animation: market-notification-bell-unread-nudge 0.9s ease-in-out 600ms 1 !important;
  }

  .market-checkin-toast {
    position: fixed;
    right: 14px;
    bottom: calc(90px + env(safe-area-inset-bottom, 0px));
    left: 14px;
    z-index: 1300;
    display: flex;
    align-items: center;
    min-height: 48px;
    padding-left: 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--panel);
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: opacity 240ms ease;
  }

  .market-checkin-toast.is-visible {
    opacity: 1;
  }

  /* The toast keeps the bottom slot; the bell rises above it while it shows. */
  .market-notification-center {
    transition: bottom 240ms ease;
  }

  body:has(.market-checkin-toast.is-visible) .market-notification-center:not(.hidden) {
    bottom: calc(150px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .market-checkin-toast-body {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    gap: 10px;
    min-width: 0;
    min-height: 46px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--text);
    text-align: left;
  }

  .market-checkin-toast-body svg,
  .market-checkin-toast-close svg {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .market-checkin-toast-body svg {
    color: var(--accent);
  }

  .market-checkin-toast-body span {
    flex: 1 1 auto;
    overflow: hidden;
    font-size: 14px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .market-checkin-toast-body b {
    color: var(--accent);
    font-size: 13px;
    font-weight: 800;
  }

  .market-checkin-toast-close {
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 46px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--muted);
  }

  /* ---------- 每日探索 (App §31) ---------- */
  #viewDiscover {
    padding-top: 12px;
  }

  /* The App's discover page does not scroll and carries no footer. */
  body[data-mm-view="discover"] .seo-link-footer {
    display: none;
  }

  body[data-mm-view="discover"] .page {
    padding-bottom: 0;
  }

  body[data-mm-view="discover"].dc-fits {
    padding-bottom: 0;
  }

  .dc-hint {
    margin: 0 0 12px;
    color: var(--muted);
    font-size: 13px;
    line-height: 20px;
  }

  .dc-hint b {
    color: var(--accent);
    font-weight: 700;
  }

  .dc-error {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    padding: 4px 4px 4px 12px;
    border: 1px solid rgba(255, 119, 119, 0.4);
    border-radius: 8px;
    background: rgba(255, 119, 119, 0.08);
  }

  .dc-error p {
    flex: 1 1 auto;
    margin: 0;
    color: var(--text);
    font-size: 12.5px;
    line-height: 18px;
  }

  .dc-error b {
    color: #ff7777;
  }

  .dc-loading {
    color: var(--muted);
    font-size: 13px;
    text-align: center;
  }

  .dc-guest {
    padding: 24px 0;
    border-top: 1px solid var(--line-soft);
    border-bottom: 1px solid var(--line-soft);
  }

  .dc-guest h3 {
    margin: 0 0 6px;
    color: var(--text);
    font-size: 18px;
    font-weight: 800;
  }

  .dc-guest p {
    margin: 0 0 12px;
    color: var(--muted);
    font-size: 13px;
    line-height: 20px;
  }

  .dc-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: var(--dc-card-height, 240px);
    gap: 12px;
    padding-bottom: 12px;
  }

  .dc-card {
    position: relative;
    display: block;
    padding: 0;
    border: 0;
    background: transparent;
    perspective: 900px;
    cursor: pointer;
  }

  .dc-card:active {
    opacity: 0.88;
  }

  .dc-face {
    position: absolute;
    inset: 0;
    overflow: hidden;
    border-radius: 11px;
    backface-visibility: hidden;
    transition: transform 480ms cubic-bezier(0.2, 0.8, 0.2, 1), opacity 180ms ease;
  }

  .dc-back {
    background: #0b1120;
    transform: rotateY(0deg);
  }

  .dc-back img {
    width: 100%;
    height: 100%;
    object-fit: fill;
  }

  .dc-front {
    border: 0.5px solid var(--line);
    background: #0b111b;
    transform: rotateY(180deg);
  }

  .dc-card.is-revealed .dc-back {
    transform: rotateY(180deg);
  }

  .dc-card.is-revealed .dc-front {
    transform: rotateY(360deg);
  }

  .dc-card.is-revealed.is-flipping .dc-back {
    transform: rotateY(0deg);
  }

  .dc-card.is-revealed.is-flipping .dc-front {
    transform: rotateY(180deg);
  }

  @media (prefers-reduced-motion: reduce) {
    .dc-face {
      transform: none !important;
      transition: opacity 180ms ease;
    }

    .dc-front,
    .dc-card.is-revealed.is-flipping .dc-front {
      opacity: 0;
    }

    .dc-card.is-revealed .dc-front {
      opacity: 1;
    }

    .dc-card.is-revealed .dc-back {
      opacity: 0;
    }

    .dc-card.is-revealed.is-flipping .dc-back {
      opacity: 1;
    }
  }

  .dc-busy {
    position: absolute;
    inset: 0;
    background: rgba(5, 9, 15, 0.45);
  }

  .dc-busy::after {
    position: absolute;
    top: calc(50% - 11px);
    left: calc(50% - 11px);
    width: 22px;
    height: 22px;
    border: 2px solid #e8b654;
    border-right-color: transparent;
    border-radius: 50%;
    content: "";
    animation: dc-spin 0.8s linear infinite;
  }

  @keyframes dc-spin {
    to {
      transform: rotate(360deg);
    }
  }

  .dc-art {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .dc-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(5, 9, 15, 0.2) 0%, rgba(5, 9, 15, 0.08) 24%, rgba(5, 9, 15, 0.86) 48%, rgba(5, 9, 15, 0.97) 100%);
  }

  .dc-chip {
    position: absolute;
    top: 10px;
    left: 10px;
    max-width: calc(100% - 20px);
    overflow: hidden;
    padding: 2px 7px;
    border-radius: 4px;
    background: rgba(5, 9, 15, 0.72);
    color: #e3e9f2;
    font-size: 11px;
    font-weight: 700;
    line-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .dc-copy {
    position: absolute;
    right: 12px;
    bottom: 54px;
    left: 12px;
    display: grid;
    text-align: left;
  }

  .dc-symbol {
    color: #aeb9c9;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
  }

  .dc-name {
    overflow: hidden;
    color: #f0f3f8;
    font-size: 19px;
    font-weight: 800;
    line-height: 26px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .dc-label {
    margin-top: 8px;
    color: #9aa6b8;
    font-size: 11px;
    line-height: 15px;
  }

  .dc-broker {
    overflow: hidden;
    color: #f0f3f8;
    font-size: 13px;
    font-weight: 700;
    line-height: 19px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .dc-amount-line {
    margin-top: 1px;
    color: #c9d3e0;
    font-size: 11px;
    line-height: 22px;
  }

  .dc-amount-line b {
    color: #e8b654;
    font-size: 17px;
    font-weight: 800;
  }

  .dc-foot {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    height: 44px;
    padding: 0 12px;
    border-top: 0.5px solid rgba(255, 255, 255, 0.14);
    color: #9aa6b8;
    font-size: 11px;
  }

  .dc-foot span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .dc-foot b {
    flex: 0 0 auto;
    color: #e8b654;
    font-size: 13px;
    font-weight: 800;
  }
}

/* 所有寬度：市場頁每日簽到視窗跟隨淺色主題。 */
/* ---------- 簽到視窗跟隨淺色主題（原本兩種主題都是深色） ---------- */
body:not(.dark-mode) .market-checkin-modal-backdrop,
body:not(.dark-mode) .market-checkin-confirm-backdrop {
  background: rgba(8, 20, 38, 0.42) !important;
}

body:not(.dark-mode) .market-checkin-dialog,
body:not(.dark-mode) .market-checkin-confirm {
  border-color: var(--line) !important;
  background: #ffffff !important;
  color: var(--text) !important;
  box-shadow: 0 24px 60px rgba(16, 34, 61, 0.18) !important;
}

body:not(.dark-mode) .market-checkin-art {
  opacity: 0.12 !important;
  mix-blend-mode: multiply !important;
}

body:not(.dark-mode) .market-checkin-dialog-head {
  border-bottom-color: var(--line-soft) !important;
}

body:not(.dark-mode) .market-checkin-dialog strong,
body:not(.dark-mode) .market-checkin-dialog h2,
body:not(.dark-mode) .market-checkin-confirm h2,
body:not(.dark-mode) .market-checkin-confirm strong {
  color: var(--text) !important;
}

body:not(.dark-mode) .market-checkin-note,
body:not(.dark-mode) .market-checkin-multiplier,
body:not(.dark-mode) .market-checkin-confirm p,
body:not(.dark-mode) .market-checkin-confirm-summary,
body:not(.dark-mode) .market-checkin-market-item {
  color: var(--muted) !important;
}

body:not(.dark-mode) .market-checkin-confirm-summary > * > :last-child,
body:not(.dark-mode) .market-checkin-confirm-summary dd {
  color: var(--text) !important;
}

body:not(.dark-mode) .market-checkin-market,
body:not(.dark-mode) .market-checkin-confirm-summary,
body:not(.dark-mode) .market-checkin-confirm-summary * {
  border-color: var(--line-soft) !important;
}

body:not(.dark-mode) .market-checkin-dialog-close,
body:not(.dark-mode) .market-checkin-help {
  border-color: var(--line) !important;
  background: rgba(16, 34, 61, 0.05) !important;
  color: var(--muted) !important;
}

/* App §37: primary actions use the blue gradient with white text in light mode. */
body:not(.dark-mode) .market-checkin-button:not(.trend-long):not(.trend-short),
body:not(.dark-mode) .market-checkin-confirm-button.primary {
  border-color: transparent !important;
  background: linear-gradient(110deg, #0867c5 0%, #0d6bc8 100%) !important;
  color: #ffffff !important;
}

body:not(.dark-mode) .market-checkin-confirm-button:not(.primary) {
  border-color: var(--line) !important;
  background: #ffffff !important;
  color: var(--text) !important;
}

body:not(.dark-mode) .market-checkin-button.trend-long {
  border-color: color-mix(in srgb, var(--up) 30%, transparent) !important;
  background: color-mix(in srgb, var(--up) 8%, transparent) !important;
  color: var(--up) !important;
}

body:not(.dark-mode) .market-checkin-button.trend-short {
  border-color: color-mix(in srgb, var(--down) 30%, transparent) !important;
  background: color-mix(in srgb, var(--down) 8%, transparent) !important;
  color: var(--down) !important;
}
