/* All changes below are phone-only. The desktop version is approved. */
@media(max-width:760px){
 /* Keep the page heading available to assistive technology without a duplicate visible title. */
 body:is([data-route="/member"],[data-route="/settings"]) .route-page>.page-heading{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;margin:0!important;padding:0}
 body:is([data-route="/member"],[data-route="/settings"]) .route-page>.page-bar{margin-bottom:12px}
 :is(h1,h2,h3)[tabindex="-1"]:focus,[data-page-title][tabindex="-1"]:focus{outline:none!important;box-shadow:none!important}
 html[data-phone-input="pointer"] :is(a,button,summary,input,select,textarea,[tabindex]):focus{outline:none!important}
 button,a,summary,label,[role="button"],[tabindex]{-webkit-tap-highlight-color:transparent}

 .vip30-panel{padding:14px;margin-bottom:14px}
 .vip30-panel .vip-levels-heading{margin-bottom:3px}
 .vip30-panel .vip-levels-rail{gap:6px;padding-block:3px 7px}
 .vip30-panel .vip-level-stop{flex-basis:72px;width:72px;min-height:86px;padding:7px 3px;gap:4px}
 .vip30-panel .vip-level-stop>.vip-emblem{width:30px;height:32px;flex-basis:32px}
 .vip-target-metrics{margin-top:6px;padding-top:10px;gap:8px 4px}
 .vip-target-metrics .vip-level-metric{padding:2px 6px}
 .vip-target-metrics .vip-level-metric>span{font-size:10px;margin-bottom:4px}
 .vip30-panel .vip-level-metric>strong,.vip30-panel .vip-level-bonus>strong{font-size:16px;line-height:1.35}
 .vip-level-bonus>strong>small{font-size:9px;margin-top:3px}

 /* One compact list card, with the important title and description retained. */
 .route-page .campaign-grid:has(.campaign-illustrated){gap:9px}
 .route-page .campaign-grid>.campaign-illustrated{grid-template-columns:80px minmax(0,1fr);min-height:108px}
 .route-page .campaign-grid>.campaign-illustrated>.campaign-body{padding:8px 11px;gap:3px;justify-content:center}
 .route-page .campaign-grid>.campaign-illustrated .campaign-body>.page-tag{display:none}
 .route-page .campaign-grid>.campaign-illustrated .campaign-body h2{font-size:15px;line-height:1.35}
 .route-page .campaign-grid>.campaign-illustrated .campaign-body p{font-size:12px;line-height:1.5;-webkit-line-clamp:2}
 .route-page .campaign-grid>.campaign-illustrated .card-action{min-height:32px;font-size:12px}

 body[data-route^="/game/"] .route-page>.page-heading{margin-bottom:12px}
 body[data-route^="/game/"] .route-page>.page-heading h1{font-size:20px;line-height:1.4}
 .game-detail.has-insights.is-combined-preview{grid-template-columns:80px minmax(0,1fr);gap:12px;padding:12px}
 .game-detail.has-insights.is-combined-preview>.detail-art{width:80px}
 .game-detail.has-insights.is-combined-preview>.detail-copy{justify-content:center}
 .game-detail.has-insights.is-combined-preview>.detail-copy>h2{display:none}
 .game-detail.has-insights.is-combined-preview>.detail-copy p{font-size:12px;line-height:1.6;margin:0 0 6px}
 .game-detail.has-insights.is-combined-preview>.detail-copy dl{margin:6px 0 0}
 .game-detail.has-insights.is-combined-preview>.detail-copy dl>div{font-size:11px;grid-template-columns:44px minmax(0,1fr);gap:6px}
 .game-detail.has-insights.is-combined-preview>.game-insights-preview{padding:12px}
 .game-insights-preview .gip-heading{margin-bottom:10px}
 .game-insights-preview .gip-heading h3{font-size:15px}
 .game-insights-preview .gip-rtp{padding-bottom:10px}
 .game-insights-preview .gip-rtp-value{font-size:32px;margin:4px 0 6px}
 .game-insights-preview .gip-rtp-value>span{font-size:17px}
 .game-insights-preview .gip-label{font-size:11px}
 .game-insights-preview .gip-secondary{gap:10px;padding-top:10px}
 .game-insights-preview .gip-stat+.gip-stat{padding-left:10px}
 .game-insights-preview .gip-value-row{min-height:30px;margin:3px 0 4px;gap:7px}
 .game-insights-preview .gip-value-row>strong{font-size:21px}
 .game-insights-preview p{font-size:11px;line-height:1.6}
 .game-detail.has-insights.is-combined-preview .gip-combined-actions{margin-top:12px;padding-top:10px;gap:8px}
 .game-detail.has-insights.is-combined-preview .gip-combined-actions .btn{min-height:44px;font-size:12px}

 body[data-route="/referral"] .route-page>.page-heading{margin-bottom:12px}
 body[data-route="/referral"] .route-page>.ui-tabs{margin-bottom:12px;padding-top:4px;padding-bottom:4px;gap:5px}
 body[data-route="/referral"] .ui-tab{padding-inline:11px;min-height:42px;font-size:12px}
 body[data-route="/referral"] .sample-panel{padding:14px}
 body[data-route="/referral"] .sample-panel>.ui-panel-heading{margin-bottom:8px}
 body[data-route="/referral"] .sample-panel>.ui-panel-heading h2{font-size:15px;margin:0}
 body[data-route="/referral"] .df-lead{font-size:12px;line-height:1.7;margin:0 0 10px}
 .sample-referral-code{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;padding:11px 12px;margin:8px 0 12px}
 .sample-referral-code>div{min-width:0}
 .sample-referral-code small{font-size:10px;margin-bottom:4px}
 .sample-referral-code input{display:block;min-width:0;width:100%;max-width:100%;height:28px;font-size:18px;padding:0;letter-spacing:.7px}
 .sample-referral-code .btn,.sample-referral-link .btn{min-height:44px;font-size:11px;padding-inline:10px;white-space:nowrap}
 .sample-referral-label{font-size:11px;margin-bottom:6px}
 .sample-referral-link{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;margin-bottom:10px}
 .sample-referral-link input{width:100%;height:44px;min-width:0;font-size:16px;padding:8px 10px;text-overflow:ellipsis}
 .sample-register-preview{font-size:12px;min-height:36px;margin:0 0 8px}
 .sample-referral-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:10px 0 0}
 .sample-referral-actions>.btn{min-width:0;min-height:40px;padding-inline:4px;font-size:11px;white-space:nowrap}
 .referral-activity-rules{padding:14px}
 .referral-activity-rules>h2{font-size:16px;margin-bottom:12px}

 /* No leftover currency column can overlap the full amount. */
 body:is([data-route="/records/transactions"],[data-route="/records/games"]) .sample-currency,
 dialog.service-modal:has(.df-record-value) .sample-currency{display:none!important}
 dialog.service-modal:has(.df-record-value) .sample-money,
 body:is([data-route="/records/transactions"],[data-route="/records/games"]) .sample-money{display:inline-block;grid-template-columns:none;white-space:nowrap}
 body:is([data-route="/records/transactions"],[data-route="/records/games"]) .sample-data-table .sample-number{display:inline-block;min-width:12.5ch;white-space:nowrap;font-variant-numeric:tabular-nums}
}