/* Phone-only follow-up; the approved desktop composition is retained. */
@media(max-width:760px){
 #page-view{position:relative}
 #page-view>.mobile-flow-tools{position:absolute;top:0;right:0}
 .ui-setting-row{padding-block:11px;gap:12px;align-items:center}
 .ui-setting-row>div:first-child{min-width:0}
 .ui-setting-row p{font-size:12px;line-height:1.6;margin:4px 0 0}
 .df-binding-row{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:10px;align-items:center}
 .df-binding-row>div:first-child{display:block;grid-column:1;grid-row:auto}
 .df-binding-row>div:first-child>strong{font-size:14px;line-height:1.5}
 .df-binding-row>div:first-child>p{grid-column:auto;grid-row:auto;margin:4px 0 0;padding:0;font-size:12px;line-height:1.6;overflow-wrap:anywhere}
 .df-binding-row .df-binding-actions{grid-column:2;grid-row:auto;align-self:center;display:flex;align-items:center;gap:7px;padding:0}
 .df-binding-badge{font-size:10px;padding:4px 6px;white-space:nowrap}
 .df-binding-actions .ui-row-action{font-size:12px;min-width:48px;min-height:44px;white-space:nowrap}
 body[data-route="/settings"] .ui-panel>h2{margin-bottom:10px;font-size:17px}
 body[data-route="/settings"] .ui-panel>h3{font-size:14px;margin:16px 0 4px;padding-top:12px}
 .security-flow-reference{margin-top:10px;gap:4px 8px}
 .security-flow-reference small{font-size:10px;line-height:1.5}
 .security-flow-reference .security-flow-link{min-height:36px;font-size:12px}
 .all-partners{padding:14px 0;margin:20px 0 16px}
 .all-partners .partners-heading{gap:8px;margin-bottom:8px}
 .all-partners .providers-title{font-size:14px}
 .all-partners .partners-controls{gap:5px}
 .all-partners .partners-controls button{width:36px;height:36px;border-radius:8px;font-size:21px}
 .all-partners .partner-rail{gap:7px;padding:2px 0 5px}
 .all-partners .partner-card{flex-basis:96px;width:96px;height:48px;padding:6px;border-radius:9px}
 .all-partners .partner-mark{width:82px;height:32px}
 .all-partners .partner-mark strong{font-size:14px}
 .sample-metrics{gap:6px;margin-bottom:11px}
 .sample-metrics>div{padding:8px 6px;min-height:60px;border-radius:9px;justify-content:center}
 .sample-metrics>div>small{font-size:10px;margin-bottom:4px}
 .sample-metrics>div>strong{font-size:clamp(11.5px,3.2vw,12.5px);line-height:1.4;letter-spacing:-.2px}
 .sample-metrics:has(>div:nth-child(2):last-child)>div>strong{font-size:16px}
 .sample-metrics .sample-currency{display:none!important}
 .sample-metrics .sample-money{display:block;white-space:nowrap}
 .sample-data-table .sample-money{grid-template-columns:max-content max-content}
 .sample-number,.bonus-rank-amount,.header-balance-text strong,.member-balance strong{font-variant-numeric:tabular-nums}
 .ui-summary dd{min-width:0;overflow-wrap:anywhere}
 .service-modal .ui-summary dd{font-size:13px;font-variant-numeric:tabular-nums}
 .service-modal .df-record-value{font-size:24px}
 .vip-level-bonus strong{font-size:12px;white-space:nowrap}
 .vip-level-bonus strong small{display:block;font-size:9px;margin:3px 0 0}
 .vip-progress-numbers{min-width:0}
 .wheel-preview[data-wheel-kind] .ui-wheel>span>b{font-size:11px;white-space:nowrap;letter-spacing:normal}
 .wheel-result h2{font-size:21px}
 .vip30-panel .vip-progress-numbers strong{font-size:18px}
 .reward-confirm-amount strong,.cashback-complete-amount strong{font-size:26px}
 .win-meta strong{font-size:11px}
 .bonus-ranking-table .bonus-rank-amount{font-size:11px}
 /* Input dialogs keep the same top edge. Only the inner scroll area changes
    when the keyboard opens/closes; bottom anchoring caused the visible jump. */
 dialog.service-modal,
 dialog.service-modal:is(.service-modal-wallet,.service-modal-wide,.service-modal-support),
 dialog.service-modal:has(.df-flow),dialog.service-modal:has(.wheel-preview),dialog.service-modal:has(.wheel-result){
  top:calc(var(--mobile-viewport-top,0px) + max(12px,env(safe-area-inset-top,0px)));
  bottom:auto;max-height:calc(var(--mobile-viewport-height,100svh) - max(12px,env(safe-area-inset-top,0px)) - max(12px,env(safe-area-inset-bottom,0px)));
  margin:0 auto;animation:none!important;transform:none!important;
 }
 dialog.service-modal .service-modal-header{flex:0 0 auto;min-height:58px;padding-block:7px!important}
 dialog.service-modal .service-modal-content{flex:1 1 auto;min-height:0;max-height:none;overflow-y:auto;overflow-anchor:none;scroll-behavior:auto;scroll-padding-block:12px}
 dialog.service-modal .df-stepper{margin-bottom:14px}
 dialog.service-modal .ui-form{gap:10px}
 dialog.service-modal .security-code-destination{padding:10px 12px}
 dialog.service-modal .df-back{margin-top:6px}
 dialog.service-modal:has(#service-search){top:var(--mobile-viewport-top,0px);max-height:var(--mobile-viewport-height,100svh)}
 dialog.service-modal>.mobile-flow-tools{top:calc(var(--mobile-viewport-top,0px) + max(12px,env(safe-area-inset-top,0px)) + 13px);right:68px}
 dialog.service-modal>.mobile-flow-tools>summary{font-size:10px;min-width:64px;min-height:28px;padding:4px 8px}
 dialog.service-modal:has(>.mobile-flow-tools:not([hidden])) .service-modal-header h1{max-width:calc(100vw - 178px);font-size:16px}
}