/* Rider readability · 2026-10-25.
   Opt-in, screen-only presentation. All workspace selectors require
   #rider.rider-readable-workspace; the existing sibling sidebar additionally
   requires that opted-in rider as a direct child of #rider-workspace-shell.
   Keep the operating navy/white palette, four categories, native disclosures,
   authoritative hidden/disabled states, every saved financial row and its DOM
   order, notices, goals and payment semantics. No admin/login/modal/print,
   exported-image/canvas or calculation rules are selected. */
@media screen {
  /* English headings and decorative labels remain intact. */
  #rider.rider-readable-workspace .rider-mobile-quick-item b {
    font-size: 14px !important;
    line-height: 1.4;
    white-space: normal;
  }
  #rider.rider-readable-workspace .rider-mobile-quick-item small {
    font-size: 12px;
    line-height: 1.5;
  }
  #rider.rider-readable-workspace label,
  #rider.rider-readable-workspace .rider-period-control > label,
  #rider.rider-readable-workspace .rider-period-filter-grid label {
    font-size: 14px !important;
    font-weight: 650 !important;
    line-height: 1.6;
  }
  #rider.rider-readable-workspace #rider-inquiry-form label {
    font-size: 14px !important;
    line-height: 1.6;
  }
  #rider.rider-readable-workspace :is(
    input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]),
    select
  ),
  #rider.rider-readable-workspace #rider-period {
    min-height: 46px !important;
    font-size: 15px !important;
    line-height: 1.5;
  }
  #rider.rider-readable-workspace textarea,
  #rider.rider-readable-workspace #rider-inquiry-question {
    font-size: 15px !important;
    line-height: 1.7;
  }
  #rider.rider-readable-workspace :is(
    .primary, .rider-goal-delete, .rider-monthly-report-download,
    .rider-period-browser-heading > button, .rider-monthly-period-toggle
  ),
  #rider.rider-readable-workspace #save-rider-goal {
    min-height: 46px !important;
    font-size: 15px !important;
    line-height: 1.5;
  }
  #rider.rider-readable-workspace .rider-current-inquiry-button {
    min-height: 46px;
  }
  #rider.rider-readable-workspace .rider-current-inquiry-button strong {
    font-size: 15px;
    line-height: 1.5;
  }
  #rider.rider-readable-workspace .rider-current-inquiry-button small {
    font-size: 13px;
    line-height: 1.6;
  }
  #rider.rider-readable-workspace .rider-settings > summary {
    min-height: 54px !important;
    line-height: 1.6;
  }
  #rider.rider-readable-workspace .rider-settings > summary > span {
    font-size: 16px !important;
    line-height: 1.5;
  }
  #rider.rider-readable-workspace .rider-settings > summary > small {
    font-size: 13px !important;
    line-height: 1.5;
    min-width: 0;
    max-width: none !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip;
    overflow-wrap: anywhere;
  }
  #rider.rider-readable-workspace :is(
    .rider-period-browser > summary, .rider-goal-editor > summary,
    .monthly-report-fold > summary, .rider-monthly-operation-details > summary,
    .rider-monthly-legacy-details > summary
  ) {
    min-height: 46px !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    overflow-wrap: anywhere;
  }
  #rider.rider-readable-workspace :is(
    .retention-note, .bank-account-note, .rider-goal-description,
    .rider-goal-storage-note, .rider-feature-group-heading p,
    .rider-period-browser-heading p, .rider-period-filter-summary,
    .rider-period-control #rider-period-current
  ) {
    color: #5f728b !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
  }
  #rider.rider-readable-workspace :is(
    .section-title p, .message, .rider-settlement-state,
    .settlement-card-message, .rider-monthly-report-notice,
    .rider-monthly-operation-details > p, .rider-monthly-legacy-details > p,
    .rider-monthly-operation-list > p
  ) {
    font-size: 14px !important;
    line-height: 1.7 !important;
    overflow-wrap: anywhere;
  }
  #rider.rider-readable-workspace :is(
    .rider-feature-group-heading h2, .rider-monthly-report-heading h2,
    .rider-goal-card .section-title h2
  ) {
    font-size: 21px !important;
    line-height: 1.45 !important;
  }

  /* Image saving/sharing remains directly available with the original controls,
     state, event handlers and status message. No additional open step. */
  #rider.rider-readable-workspace .settlement-card-action {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px !important;
  }
  #rider.rider-readable-workspace .settlement-card-action h2 {
    font-size: 18px !important;
    line-height: 1.5;
  }
  #rider.rider-readable-workspace .settlement-card-action > div:first-child > p {
    font-size: 14px !important;
    line-height: 1.7;
  }
  #rider.rider-readable-workspace .settlement-card-action .settlement-card-actions {
    min-width: 0;
    grid-template-columns: minmax(140px, .8fr) minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 10px !important;
    align-items: end !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  #rider.rider-readable-workspace .settlement-card-action .settlement-card-type {
    min-width: 0 !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
  }
  #rider.rider-readable-workspace .settlement-card-action .settlement-card-type select {
    min-width: 0 !important;
    min-height: 46px !important;
    font-size: 15px !important;
    line-height: 1.5;
  }
  #rider.rider-readable-workspace .settlement-card-action .settlement-card-actions button {
    min-width: 0;
    min-height: 46px !important;
    padding: 10px !important;
    font-size: 15px !important;
    line-height: 1.5;
    white-space: normal;
  }

  /* Monthly financial values remain complete, in their existing DOM order. */
  #rider.rider-readable-workspace :is(
    .rider-monthly-report-primary span, .rider-monthly-report-primary small,
    .rider-monthly-report-section-title > span, .rider-monthly-platform span,
    .rider-monthly-platform small, .rider-monthly-statuses span,
    .rider-monthly-statuses small, .rider-monthly-insights > article > span,
    .rider-monthly-insights .monthly-tax-breakdown,
    .rider-monthly-mission > .monthly-tax-breakdown,
    .rider-monthly-mission-period, .rider-monthly-report-paid-reference > small,
    .rider-monthly-operation,
    .rider-monthly-report-empty span
  ) {
    color: #5f728b !important;
    font-size: 13px !important;
    line-height: 1.7;
  }
  /* A paid/held badge keeps its existing semantic foreground and background. */
  #rider.rider-readable-workspace .rider-monthly-period small {
    font-size: 13px !important;
    line-height: 1.7;
  }
  #rider.rider-readable-workspace :is(
    .rider-monthly-report-heading p, .rider-monthly-report-note,
    .rider-monthly-report-section-title > b, .rider-monthly-period b,
    .rider-monthly-period em, .monthly-tax-detail > p,
    .rider-monthly-financial-other, .rider-monthly-report-paid-reference > span
  ) {
    color: #526b86 !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
  }
  #rider.rider-readable-workspace .rider-monthly-report-primary strong,
  #rider.rider-readable-workspace .rider-monthly-report-primary.is-financial strong,
  #rider.rider-readable-workspace .rider-monthly-statuses strong,
  #rider.rider-readable-workspace .rider-monthly-insights strong,
  #rider.rider-readable-workspace .rider-goal-metric strong {
    max-width: 100%;
    font-size: 20px !important;
    line-height: 1.4;
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: anywhere;
    font-variant-numeric: tabular-nums;
  }
  #rider.rider-readable-workspace .rider-monthly-platform > strong,
  #rider.rider-readable-workspace .rider-monthly-report-primary .is-pay strong,
  #rider.rider-readable-workspace .rider-monthly-report-paid-reference > strong {
    max-width: 100%;
    font-size: 22px !important;
    line-height: 1.4;
    white-space: normal;
    overflow-wrap: anywhere;
    font-variant-numeric: tabular-nums;
  }
  #rider.rider-readable-workspace .rider-monthly-report-primary article {
    min-width: 0;
    padding: 13px;
  }
  #rider.rider-readable-workspace .rider-monthly-period > span {
    min-width: 0;
    flex-wrap: wrap;
  }
  #rider.rider-readable-workspace .rider-monthly-period :is(b, em, small) {
    min-width: 0;
    max-width: 100%;
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  #rider.rider-readable-workspace :is(button, summary, input, select, textarea):focus-visible {
    outline: 3px solid #7199c5 !important;
    outline-offset: 3px;
  }

  #rider-workspace-shell:has(> #rider.rider-readable-workspace) .rider-desktop-sidebar .rider-sidebar-brand {
    padding-block: 19px;
  }
  #rider-workspace-shell:has(> #rider.rider-readable-workspace) .rider-desktop-item b {
    font-size: 15px;
    line-height: 1.5;
  }
  #rider-workspace-shell:has(> #rider.rider-readable-workspace) .rider-desktop-item small {
    color: #60748b !important;
    font-size: 12px;
    line-height: 1.5;
  }
}

@media screen and (max-width: 959px) {
  #rider.rider-readable-workspace :is(
    input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]),
    select, textarea
  ),
  #rider.rider-readable-workspace #rider-period,
  #rider.rider-readable-workspace #rider-inquiry-question,
  #rider.rider-readable-workspace .settlement-card-action .settlement-card-type select {
    font-size: 16px !important;
  }
}

@media screen and (max-width: 760px) {
  #rider.rider-readable-workspace .rider-monthly-report-primary.is-financial {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #rider.rider-readable-workspace .rider-monthly-report-section-title {
    gap: 7px;
    align-items: flex-start;
    flex-direction: column;
  }
  #rider.rider-readable-workspace .rider-monthly-report-section-title > span {
    text-align: left;
  }
  #rider.rider-readable-workspace .rider-monthly-operation {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 6px 12px;
  }
  #rider.rider-readable-workspace .rider-monthly-operation :is(b, strong) {
    min-width: 0;
    font-size: 14px;
    line-height: 1.6;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  #rider.rider-readable-workspace .rider-monthly-period {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
  }
  #rider.rider-readable-workspace .rider-monthly-period > :is(span, em, small) {
    grid-column: 1 !important;
    grid-row: auto !important;
    justify-self: start;
    text-align: left;
  }
  #rider.rider-readable-workspace .settlement-card-action .settlement-card-actions {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  }
  #rider.rider-readable-workspace .settlement-card-action .settlement-card-type {
    grid-column: 1 / -1 !important;
  }
}

/* On narrow phones keep the four-character notice label intact. The existing
   unread count becomes an icon-corner indicator; native hidden/color stay. */
@media screen and (max-width: 620px) {
  #rider.rider-readable-workspace .rider-mobile-quick-item[data-rider-mobile-view="notices"] {
    position: relative;
  }
  #rider.rider-readable-workspace .rider-mobile-quick-item[data-rider-mobile-view="notices"] b {
    white-space: nowrap;
  }
  #rider.rider-readable-workspace .rider-mobile-quick-item[data-rider-mobile-view="notices"] .rider-notice-unread-badge {
    position: absolute;
    top: 5px;
    right: 5px;
  }
}

/* The selector already names the chosen round. Keep the controller node intact. */
@media screen {
  #rider.rider-readable-workspace #rider-period-current {
    display: none !important;
  }
}