/* Readability and input preferences; keep this after the screen styles. */
:root { --focus-ring: #B8D8FF; }
html { font-size: 100%; }
body { line-height: 1.5; }

/* These are comfortable mobile targets, not a conformance declaration. */
button { min-width: 44px; }
button:not(.auction-switch) { min-height: 44px !important; }
button:not(:where(.pin-key, .icon-button, .market-icon-button, .auction-dismiss, .auction-back, .auction-watch, .auction-add-control, .auction-switch, #back)) {
  height: auto !important;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
summary { min-height: 44px; padding-block: 10px; line-height: 1.5; }
:is(.check-row, .market-setting, .auction-bank-row, .auction-setting) { min-height: 44px; }
.auction-switch::before { content: ""; position: absolute; inset: -8px 0; }
input[type=file]::file-selector-button { min-height: 44px; padding: 8px 12px; font: inherit; }
.pin-keypad, .pin-key { touch-action: manipulation; }
.pin-key { min-height: 2.4em !important; }

/* One blue ring stays visible even inside panels that clip their children. */
:is(button, a, input, select, textarea, summary):focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: -2px;
}
.phrase-option input:focus-visible + span {
  outline: 2px solid var(--focus-ring);
  outline-offset: -2px;
}
.pin-entry:has(.pin-accessible-input:focus-visible) .pin-dots {
  outline: 2px solid var(--focus-ring);
  outline-offset: 8px;
  border-radius: 6px;
}

/* Paused networks and unavailable features still need readable explanations. */
button:disabled, .deposit-network.network-paused, .services-screen .service-unavailable {
  opacity: 1;
  cursor: not-allowed;
  color: var(--muted);
}
:is(.primary, .auction-primary, .market-buy):disabled { background: var(--surface-raised); }
.phrase-option input:disabled + span { opacity: 1; color: var(--muted); }
.balance-unit { color: var(--muted); }
:is(.network-badge, .market-reserved, .message-time, .wallet-screen .asset-rate, .wallet-screen .asset-unavailable,
    .activity-amount small, .connection-caption small) { font-size: .8125rem; }
nav button { font-size: .8125rem; padding-block: 6px; }
:is(.market-screen .market-offer-price small, .auction-screen .auction-metrics small, .auction-card-facts small) { font-size: .8125rem; }
.footnote { font-size: .8125rem; }
.wallet-screen .asset-rate { color: var(--muted); }
.wallet-screen .actions { grid-template-columns: repeat(auto-fit, minmax(min(100%, 4rem), 1fr)); }

/* Text can grow without forcing actions or evidence names outside the viewport. */
:is(.app-shell, #content, .field, .contact-form, .support-file-picker, .reply-form) { min-width: 0; }
:is(h1, h2, h3, label, legend, summary, .connection-caption, .contact-title, .settings-value) { overflow-wrap: anywhere; }
fieldset { min-width: 0; }
input:not(:where([type=checkbox], [type=radio], [type=hidden], .pin-accessible-input)), select, textarea {
  height: auto;
  line-height: 1.5;
}
.detail-row > :is(span, strong) { min-width: 0; }
.withdrawal-available-value { flex-wrap: wrap; }
.withdrawal-flow-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.withdrawal-flow-actions .secondary { white-space: normal; }
.withdrawal-paste { white-space: normal; padding-block: 8px; }
.connection-banner { flex-wrap: wrap; }
.connection-caption { flex-basis: 160px; }
.connection-retry { max-width: 100%; }
.auction-rate-quick, .market-chat-actions, .contact-actions { flex-wrap: wrap; }
.auction-rate-quick button { flex-basis: 80px; padding-block: 8px; }
.auction-country-control { white-space: normal; min-width: 0; }
.auction-preview-duration { white-space: normal; }
.auction-market-tabs button { padding-block: 10px; white-space: normal; }
.market-design .market-tabs button { white-space: normal; }
.market-design .market-limit-fields { grid-template-columns: repeat(auto-fit, minmax(min(100%, 8.5rem), 1fr)); }
.market-design .market-limit-fields .field input { min-height: 3em; height: auto; padding-right: 2.625rem; }
.market-design .market-limit-fields .market-input-unit { right: .625rem; bottom: .9375rem; }
.market-flow .market-actions:has(details[open]) {
  position: static;
  transform: none;
  width: 100%;
}
.auction-create:has(details[open]) { height: auto; }
.auction-create:has(details[open]) .auction-wizard { overflow: visible; }
.auction-create:has(details[open]) .auction-flow-body { overflow: visible; }
.support-screen .support-file-item { flex-wrap: wrap; }
.support-screen .support-file-item > span { flex-basis: 140px; }
.phrase-screen { container-type: inline-size; }
.phrase-grid li { min-width: 0; }
nav { min-height: calc(4.75rem + var(--safe-bottom)); }
.app-shell { padding-bottom: calc(6rem + var(--safe-bottom)); }
body:has(nav:not([hidden])) .withdrawal-flow-actions { bottom: calc(4.75rem + var(--safe-bottom)); }
#notice { bottom: calc(5.5rem + var(--safe-bottom)); max-height: calc(100dvh - var(--safe-top) - 7rem - var(--safe-bottom)); overflow-y: auto; }

@media (max-width: 350px) {
  .balance-number { font-size: 2.25rem; }
  .withdrawal-screen .field .withdrawal-amount-input { font-size: 2.25rem; }
  .wallet-screen .actions button { min-height: 80px; font-size: .875rem; }
  .wallet-screen .asset { grid-template-columns: 32px minmax(0, 1fr); }
  .wallet-screen .asset-value { grid-column: 2; text-align: left; }
  .wallet-screen .asset-unavailable { grid-column: 2; }
  .auction-market-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .market-design .market-filters { grid-template-columns: 1fr; }
  .market-design .market-limit-fields { grid-template-columns: 1fr; }
  .phrase-options { grid-template-columns: 1fr; }
  .phrase-option span { font-size: .875rem; }
  .phrase-grid { column-gap: 12px; font-size: .875rem; }
  .withdrawal-flow-actions { grid-template-columns: 1fr; }
  .withdrawal-address-entry { flex-wrap: wrap; }
  .withdrawal-address-entry input { flex-basis: 100%; }
  .withdrawal-paste { margin-left: auto; }
}
@container (max-width: 22rem) {
  .phrase-grid { grid-template-columns: 1fr; grid-template-rows: none; grid-auto-flow: row; }
  .phrase-options { grid-template-columns: 1fr; }
}
@media (max-height: 40rem) {
  .market-flow .market-actions { position: static; transform: none; width: 100%; }
  .auction-create { height: auto; }
  .auction-wizard, .auction-flow-body { overflow: visible; }
  .auction-sheet { max-height: calc(100dvh - var(--safe-top) - var(--safe-bottom)); overflow-y: auto; }
  .auction-sheet-body, .auction-sheet-body:has(> .auction-bank-list) { overflow: visible; flex-shrink: 0; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  button:not(:disabled):active { transform: none; }
}
@media (prefers-reduced-transparency: reduce) {
  *, *::before, *::after { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
  .connection-banner { background: #18233B; }
  .connection-banner[data-status=recovered] { background: #183329; }
  :is(.welcome-language-overlay, .market-design .market-sheet-overlay, .auction-sheet-backdrop) { background: var(--background); }
  .auction-sheet::backdrop { background: var(--background); }
}
@media (forced-colors: active) {
  :is(button, a, input, select, textarea, summary):focus-visible,
  .phrase-option input:focus-visible + span { outline-color: Highlight; }
  button, input, select, textarea { border: 1px solid ButtonText; }
}