/* Phone-specific layer, loaded after the unmodified desktop stylesheet. */
html.android-toolbox, .mobile-app { min-width: 320px; -webkit-text-size-adjust: 100%; }
.mobile-app { --mono: ui-monospace, "Roboto Mono", monospace; }
.mobile-app button, .mobile-app input, .mobile-app label { touch-action: manipulation; }
.mobile-app .topbar { height: 44px !important; padding: 0 8px; gap: 4px; }
.mobile-app .brand { gap: 5px; min-width: 0; }
.mobile-app .brand-mark { width: 19px; height: 19px; }
.mobile-app .brand h1 { font-size: 12px; }
.mobile-app .brand p, .mobile-app .save-state, .mobile-app .fee-state, .mobile-app #togglePin { display: none !important; }
.mobile-app .tool-tabs button { font-size: 11px; padding: 0 6px; min-width: 0; }
.mobile-app .topbar-actions { gap: 0; }
.mobile-app .topbar-actions .button { min-height: 32px; font-size: 10px; padding: 0 7px; }
.mobile-app .calculator-view { min-height: calc(100dvh - 44px); }
.mobile-app.calculator-active .calculator-page { padding: 5px 6px 12px; width: 100%; max-width: none; }
.mobile-app .calculator-page-heading { display: none !important; }
.mobile-app .calculator-workspace-toolbar { min-height: 34px; margin: 0 0 5px; gap: 5px; }
.mobile-app .calculator-multi-toggle { font-size: 11px; gap: 4px; min-height: 32px; }
.mobile-app .calculator-multi-toggle input { width: 17px; height: 17px; }
.mobile-app .calculator-symbol-jump { height: 34px; }
.mobile-app .calculator-symbol-jump button { height: 28px; padding: 0 6px; font-size: 11px; }
.mobile-app .calculator-page-navigation { gap: 3px; }
.mobile-app .calculator-page-navigation button { width: 25px; height: 30px; min-height: 30px; }
.mobile-app .calculator-workspace-toolbar .button { min-height: 30px; height: 30px; padding: 0 6px; font-size: 10px; }
.mobile-app .calculator-pages { min-width: 0; }
.mobile-app .calculator-pages.multi-symbol { grid-auto-columns: calc(100% - 4px); gap: 8px; }
.mobile-app.calculator-active .calculator-pages .calculator-card { padding: 0 0 6px; }
.mobile-app .multi-symbol .calculator-symbol-heading { min-height: 34px; padding: 2px 8px; gap: 6px; }
.mobile-app .calculator-symbol-heading input { height: 28px; font-size: 14px; }
.mobile-app .calculator-symbol-heading .text-button { min-height: 28px; padding: 3px; font-size: 11px; }
.mobile-app.calculator-active .calculator-layout { display: flex; flex-direction: column; }
.mobile-app.calculator-active .calculator-pages .calculator-inputs,
.mobile-app.calculator-active .calculator-pages .calculator-results { padding: 7px 8px; }
.mobile-app.calculator-active .calculator-results { border-left: 0; border-top: 1px solid var(--line); }
.mobile-app.calculator-active .calculator-direction legend { float: left; padding-top: 7px; font-size: 11px; }
.mobile-app.calculator-active .calculator-pages .calculator-direction .direction-toggle { margin: 0 0 0 65px; padding: 2px; }
.mobile-app.calculator-active .calculator-pages .calculator-direction .direction-toggle button { height: 28px; font-size: 13px; }
.mobile-app.calculator-active .calculator-input-grid { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 0 7px; }
.mobile-app.calculator-active .calculator-pages .calculator-input-grid .input-field { margin-top: 5px; }
.mobile-app.calculator-active .calculator-pages .field-heading { font-size: 11px; line-height: 14px; }
.mobile-app.calculator-active .calculator-input-grid .field-heading small { display: none; }
.mobile-app.calculator-active .calculator-pages .calculator-input-grid .input-field > input,
.mobile-app.calculator-active .calculator-pages .calculator-input-grid .percentage-input { height: 32px; margin-top: 3px; font-size: 14px; }
.mobile-app.calculator-active .calculator-pages .calculator-fee-block { margin-top: 6px; padding-top: 6px; }
.mobile-app.calculator-active .checkbox-row { min-height: 24px; gap: 6px; align-items: center; }
.mobile-app.calculator-active .checkbox-row strong { font-size: 11px; }
.mobile-app.calculator-active .checkbox-row input { width: 17px; height: 17px; margin: 0; }
.mobile-app.calculator-active .checkbox-row small, .mobile-app .calculator-fee-source { display: none !important; }
.mobile-app.calculator-active .calculator-fee-fields { padding: 3px; margin-top: 3px; gap: 5px; }
.mobile-app.calculator-active .calculator-execution-row { grid-template-columns: 26px minmax(0,1fr); gap: 3px; }
.mobile-app.calculator-active .calculator-execution-row > span { font-size: 10px; line-height: 13px; }
.mobile-app.calculator-active .calculator-pages .calculator-execution-row .execution-toggle { padding: 1px; }
.mobile-app.calculator-active .calculator-pages .calculator-execution-row .execution-toggle button { height: 30px; padding: 0 2px; font-size: 10px; line-height: 12px; }
.mobile-app.calculator-active .calculator-result-heading { order: 0; padding-bottom: 6px; }
.mobile-app.calculator-active .calculator-result-heading span { font-size: 12px; }
.mobile-app.calculator-active .calculator-result-heading strong { font-size: 11px; }
.mobile-app.calculator-active .calculator-primary-results { order: 1; margin-top: 6px; gap: 7px; }
.mobile-app.calculator-active .calculator-primary-results article { padding: 7px; }
.mobile-app.calculator-active .calculator-primary-results span { font-size: 10px; }
.mobile-app.calculator-active .calculator-primary-results strong { margin-top: 4px; font-size: 16px; white-space: normal; overflow-wrap: anywhere; }
.mobile-app.calculator-active .calculator-primary-results small { display: none; }
.mobile-app.calculator-active .calculator-details { order: 2; margin-top: 6px; gap: 0 8px; }
.mobile-app.calculator-active .calculator-pages .calculator-details > div { min-height: 25px; padding: 4px 0; gap: 4px; }
.mobile-app.calculator-active .calculator-details dt,
.mobile-app.calculator-active .calculator-details dd { font-size: 10px; }
.mobile-app.calculator-active .calculator-details dd { white-space: normal; overflow-wrap: anywhere; overflow: visible; }
.mobile-app.calculator-active .calculator-actual-profit { order: 3; margin-top: 6px; padding-top: 6px; }
.mobile-app.calculator-active .calculator-actual-heading { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 5px 8px; }
.mobile-app.calculator-active .calculator-actual-copy { grid-column: 1/-1; display: flex; align-items: baseline; justify-content: space-between; gap: 4px; }
.mobile-app.calculator-active .calculator-actual-copy h3 { font-size: 12px; white-space: nowrap; }
.mobile-app.calculator-active .calculator-actual-copy p { margin: 0; font-size: 9px; }
.mobile-app.calculator-active .calculator-actual-input .field-heading b { font-size: 11px; }
.mobile-app.calculator-active .calculator-actual-input { margin-top: 0; }
.mobile-app.calculator-active .calculator-actual-input .percentage-input { height: 32px; margin-top: 3px; }
.mobile-app.calculator-active .calculator-actual-input input { font-size: 13px; padding: 0 5px; }
.mobile-app.calculator-active .calculator-actual-metrics { margin-top: 5px; }
.mobile-app.calculator-active .calculator-actual-metrics > div { padding: 4px; }
.mobile-app.calculator-active .calculator-actual-metrics dt { font-size: 10px; }
.mobile-app.calculator-active .calculator-actual-metrics dd { font-size: 11px; overflow-wrap: anywhere; white-space: normal; }
.mobile-app.calculator-active .calculator-actual-hint { margin-top: 4px; font-size: 10px; }
.mobile-app.calculator-active .calculator-warning { order: 4; margin-top: 7px; padding: 6px; font-size: 10px; }
.mobile-app.calculator-active .calculator-note { order: 5; margin-top: 5px; font-size: 9px; }
.mobile-app dialog { max-height: calc(100dvh - 24px); width: calc(100vw - 20px); }
.mobile-app .settings-card input { font-size: 16px; }
.mobile-app .settings-actions .button, .mobile-app .close-button { min-height: 36px; }
.mobile-app .order-tabs button { min-height: 36px; }
.mobile-app .auto-switch-option { min-height: 32px; }
.mobile-app .ratio-slider { min-height: 28px; }
.mobile-app .submit-order { min-height: 42px; }
.mobile-app .table-wrap { -webkit-overflow-scrolling: touch; }
.mobile-app #openSetup { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.mobile-app #openSetup .direction-block, .mobile-app #openSetup .leverage-control { margin: 6px 0 0; }
.mobile-app #openSetup .leverage-quick { display: none; }
.mobile-app #openSetup .direction-toggle, .mobile-app #openSetup .leverage-input { height: 36px; margin-top: 5px; }
.mobile-app #openSetup .direction-toggle button { min-height: 30px; font-size: 12px; }
.mobile-app #openSetup .field-heading { font-size: 12px; }
.mobile-app #openSetup .field-heading small { display: none; }
@media (max-width: 360px) {
  .mobile-app .brand h1 { font-size: 11px; }
  .mobile-app .tool-tabs button { padding: 0 4px; font-size: 10px; }
  .mobile-app .calculator-page-navigation { display: none !important; }
  .mobile-app.calculator-active .calculator-primary-results strong { font-size: 14px; }
}
