/* The desktop composition is approved. Every rule in this file is phone-only. */
@media (max-width:760px) {
  /* A larger shared welcome image, with the form kept within easy reach. */
  dialog.account-modal { --account-banner-size:clamp(148px,24dvh,184px); }
  dialog.account-modal .account-banner-slide>img { object-position:72% 48%; }
  dialog.account-modal .account-banner-copy { max-width:calc(100% - 46px); }
  dialog.account-modal .account-banner-copy h3 { line-height:1.35; }

  /* One title per page; keep useful reading introductions, remove repeated chrome. */
  .route-page>.page-bar { margin-bottom:8px; }
  .route-page>.page-bar>span,
  .route-page>.page-heading>.eyebrow { display:none; }
  .route-page>.page-bar .page-back { min-height:36px;padding-block:6px;font-size:12px; }
  .route-page>.page-heading { margin-bottom:16px; }
  .route-page>.page-heading h1 { font-size:24px;line-height:1.4;margin:0;letter-spacing:-.3px; }
  .route-page>.page-heading p { margin-top:8px;font-size:13px;line-height:1.7; }
  body:is([data-route="/member"],[data-route="/settings"],[data-route="/bonus"],[data-route="/vip"],[data-route="/referral"],[data-route="/providers"],[data-route="/downloads"],[data-route="/wallet/addresses"],[data-route^="/promotion/"],[data-route="/records/transactions"],[data-route="/records/games"],[data-route="/promotions"],[data-route^="/games/"],[data-route^="/provider/"],[data-route^="/game/"]) .route-page>.page-heading>p { display:none; }
  .member-subnav { display:flex;gap:4px;margin:0 0 16px;padding-bottom:8px; }
  .member-subnav>a[href^="#/wallet/"] { display:none; }
  .member-subnav>.ui-tab { flex:1;justify-content:center;padding:9px 8px;font-size:12px; }
  .ui-tabs { gap:6px;margin-bottom:16px;scrollbar-width:none; }
  .ui-tab { font-size:12px;min-height:44px;padding-inline:13px; }
  .ui-panel { padding:16px;border-radius:14px;margin-bottom:16px; }
  .ui-panel-heading { gap:10px;margin-bottom:14px; }
  .ui-panel-heading h2 { font-size:17px;line-height:1.5; }
  .ui-panel>h2 { font-size:17px;margin-bottom:14px; }
  .ui-setting-row { padding-block:14px;gap:12px; }
  .ui-setting-row>div:first-child { min-width:0; }
  .ui-setting-row strong { font-size:14px; }
  .ui-setting-row p { font-size:12px;line-height:1.65;margin-top:4px; }
  .df-binding-actions { gap:10px;flex-shrink:0; }
  .df-binding-badge { min-width:0;padding:4px 6px;font-size:10px; }
  .ui-row-action { min-height:44px;font-size:12px; }

  body[data-route="/member"] .member-overview { padding:16px;gap:14px;margin-bottom:16px; }
  body[data-route="/member"] .member-identity .ui-badge { display:none; }
  body[data-route="/member"] .member-avatar { width:46px;height:46px;flex-basis:46px;font-size:25px; }
  body[data-route="/member"] .member-identity h2 { margin:0 0 6px;font-size:19px; }
  body[data-route="/member"] .member-balance { padding-top:14px;gap:7px; }
  body[data-route="/member"] .member-balance>strong { font-size:27px; }
  body[data-route="/member"] .ui-feature-card { position:relative;min-height:110px;padding:14px; }
  body[data-route="/member"] .ui-feature-card h3 { font-size:14px;margin:10px 0 0; }
  body[data-route="/member"] .ui-feature-card p { display:none; }
  body[data-route="/member"] .ui-feature-card>.icon:last-child { position:absolute;right:12px;top:16px;margin:0; }
  body[data-route="/member"] .ui-feature-card:last-child { grid-column:1/-1;min-height:64px;display:flex;align-items:center;gap:12px; }
  body[data-route="/member"] .ui-feature-card:last-child h3 { margin:0; }
  body[data-route="/member"] .ui-feature-card:last-child>.icon:last-child { top:24px; }

  /* Short tasks are real floating dialogs; only their content scrolls when needed. */
  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) {
    inset:auto 10px max(10px,env(safe-area-inset-bottom,0px));
    margin:0 auto;width:calc(100% - 20px);max-width:540px;height:auto;
    max-height:calc(var(--mobile-viewport-height,100dvh) - env(safe-area-inset-top,0px) - max(10px,env(safe-area-inset-bottom,0px)) - 16px);
    border:1px solid #49655e;border-radius:20px;background:#202725;
    box-shadow:0 18px 70px #0009;overflow:hidden;
  }
  dialog.service-modal::backdrop { background:#07100ed6;backdrop-filter:blur(8px); }
  dialog.service-modal .service-modal-header {
    padding:10px 16px!important;min-height:64px;gap:12px;
    background:linear-gradient(115deg,#283a35,#252c29);border-bottom:1px solid #4b645b66;
  }
  dialog.service-modal .service-modal-header>div>span { display:none; }
  dialog.service-modal .service-modal-header h1 { font-size:18px;line-height:1.4;margin:0; }
  dialog.service-modal .service-close { width:44px;height:44px;border-radius:12px;background:#ffffff06;border-color:#91b6a32b; }
  dialog.service-modal .service-modal-content {
    flex:1 1 auto;padding:16px;min-height:0;overflow-x:hidden;overflow-y:auto;
    scrollbar-gutter:auto;scroll-padding-block:16px;
  }
  dialog.service-modal .service-modal-content:has(>.wheel-preview) { flex:0 0 auto;padding:12px 14px;overflow:visible; }
  dialog.service-modal:has(#service-search) { inset:0;margin:0;width:100%;max-width:100%;height:var(--mobile-viewport-height,100dvh);max-height:var(--mobile-viewport-height,100dvh);border:0;border-radius:0; }
  dialog.service-modal:has(#service-search) .service-modal-header { padding-top:calc(10px + env(safe-area-inset-top,0px))!important; }
  .service-modal .df-flow { min-height:0; }
  .service-modal .df-stepper { gap:5px;margin:0 0 18px; }
  .service-modal .df-stepper b { width:27px;height:27px;font-size:11px; }
  .service-modal .df-stepper>span:not(:last-child):after { top:13px;left:calc(50% + 16px);right:calc(-50% + 11px); }
  .service-modal .df-stepper>span:not(.current) small { position:absolute;width:1px;height:1px;margin:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap; }
  .service-modal .df-stepper small { font-size:11px;margin-top:7px;max-width:100%; }
  .service-modal .df-form,.service-modal .ui-form { gap:12px; }
  .service-modal .ui-field { gap:5px; }
  .service-modal .ui-field>span { font-size:12px; }
  .service-modal .ui-field :is(input,select) { min-height:46px;padding-block:10px; }
  .service-modal .ui-form>.btn,.service-modal .ui-wide { min-height:46px;font-size:14px; }
  .service-modal .ui-summary { gap:10px;font-size:13px;margin:14px 0;padding-block:12px; }
  .service-modal .ui-summary dt { min-width:0;max-width:35%; }
  .service-modal .ui-summary dd { line-height:1.65; }
  .service-modal .ui-tabs { margin-bottom:14px; }
  .service-modal .df-lead { font-size:13px;line-height:1.75;margin-bottom:14px; }
  .service-modal .df-result { padding:4px 0; }
  .service-modal .df-result-icon { width:56px;height:56px;margin-bottom:14px; }
  .service-modal .df-result h2 { font-size:22px;margin:10px 0; }
  .service-modal .df-result p { font-size:13px;margin-bottom:16px; }
  .service-modal .reward-confirmation h2 { font-size:22px; }
  .service-modal .reward-confirm-name { margin-bottom:14px; }
  .service-modal .reward-confirm-amount { padding:14px;margin-bottom:14px; }
  .service-modal .df-back { margin-top:10px;font-size:12px; }
  .service-modal .df-wallet-intro { margin:0 0 18px; }
  .service-modal .df-wallet-intro .ui-card-icon { width:38px;height:38px; }
  .service-modal .df-wallet-intro h2 { font-size:20px;margin:12px 0 0; }
  .service-modal .df-wallet-intro>p { display:none; }
  .service-modal .df-option { min-height:72px;padding:14px;gap:12px; }
  .service-modal .df-option b { font-size:15px; }
  .service-modal .df-option small { font-size:12px;margin-top:4px; }
  .service-modal .ui-dialog-links { justify-content:center;margin-top:10px; }
  .service-modal .ui-search-results>a { min-height:72px;padding:10px;gap:12px; }
  .service-modal .ui-search-results>a>img { width:44px;height:60px; }
  .service-modal .ui-support-welcome { padding:0 0 14px; }
  .service-modal .ui-support-welcome>.icon { display:none; }
  .service-modal .ui-support-welcome h2 { font-size:20px;margin-bottom:8px; }
  .service-modal .ui-support-welcome p { font-size:13px;line-height:1.7; }
  .service-modal .ui-support-option { min-height:54px;padding:12px;font-size:13px; }
  .service-modal .security-method-button { min-height:94px; }
  .service-modal .security-choice-intro p { font-size:12px; }
  .service-modal .security-code-progress:has(>div>.security-progress-chip:only-child) { display:none; }
  .service-modal .bonus-condition-heading { gap:12px;margin-bottom:14px; }
  .service-modal .bonus-condition-heading h2 { font-size:20px; }
  .service-modal .bonus-condition-heading .ui-card-icon { width:38px;height:38px; }
  .service-modal .bonus-condition-amount { font-size:20px; }
  .service-modal .bonus-condition-unlock { padding:12px;margin-bottom:18px; }
  .service-modal .bonus-condition-section { margin:18px 0; }
  .service-modal .bonus-condition-section h3 { font-size:14px;margin-bottom:8px; }
  .service-modal .bonus-condition-section p,.service-modal .bonus-condition-section li { font-size:13px;line-height:1.8; }
  .service-modal .bonus-condition-actions { gap:8px;margin-top:18px;padding-top:14px;align-items:stretch; }
  .service-modal .bonus-condition-actions>a { justify-content:center;text-align:center; }
  .service-modal .ui-table th,.service-modal .ui-table td { padding:10px 8px;font-size:12px; }

  /* Rewards keep their qualification and action; full wording remains in the conditions dialog. */
  .bonus-overview.bonus-overview-ranked { padding:16px; }
  .bonus-overview-ranked .bonus-overview-body { gap:16px; }
  .bonus-overview-ranked .bonus-metric-claimed { padding:0; }
  .bonus-overview-ranked .bonus-number { margin-top:10px; }
  .bonus-ranking { padding-top:14px; }
  .bonus-ranking-scroll { height:184px; }
  .ui-reward-grid.reward-grid-expanded { grid-template-columns:minmax(0,1fr);gap:12px; }
  .reward-grid-expanded>.ui-reward { min-height:0;padding:16px;position:relative; }
  .reward-grid-expanded>.ui-reward>.ui-card-icon { position:absolute;top:16px;left:16px;width:34px;height:34px; }
  .reward-grid-expanded>.ui-reward>h3 { min-height:34px;display:flex;align-items:center;margin:0 32px 8px 46px;font-size:16px; }
  .reward-grid-expanded .df-reward-max { font-size:13px;line-height:1.6;margin:6px 0 8px; }
  .reward-grid-expanded>.ui-reward>p:not(.df-reward-unlock) { display:none; }
  .reward-grid-expanded>.ui-reward>.df-reward-unlock { font-size:12px;line-height:1.7;margin-bottom:14px; }
  .reward-grid-expanded .df-reward-actions { flex-direction:row;gap:12px;align-items:center; }
  .reward-grid-expanded .df-reward-actions>.btn { flex:1;width:auto;min-height:44px;font-size:13px; }
  .reward-grid-expanded .df-reward-info { width:auto;min-height:44px;font-size:12px; }
  .reward-grid-expanded .cashback-card-top { padding-right:30px;gap:10px; }
  .reward-grid-expanded .cashback-card-top .ui-card-icon { width:34px;height:34px; }
  .reward-grid-expanded>.cashback-card>h3 { margin:10px 0 0;min-height:0; }
  body:is([data-route="/vip"],[data-route="/bonus"],[data-route="/referral"]) .route-page>.ui-tabs {
    position:sticky;top:calc(var(--phone-header,64px) + env(safe-area-inset-top,0px));
    z-index:5;background:#232323;padding-top:6px;box-shadow:0 8px 12px #232323;
  }

  /* Dense selectors remain horizontal and their important figures remain visible. */
  .vip30-panel { padding:16px; }
  .vip30-panel .vip-progress-summary { margin-bottom:12px; }
  .vip-tier-choices { grid-template-columns:repeat(4,minmax(0,1fr));gap:5px; }
  .vip-tier-choice { flex-direction:column;min-height:74px;padding:8px 3px;gap:5px; }
  .vip-tier-choice .vip-emblem { width:30px;height:30px; }
  .vip-tier-choice strong { font-size:11px; }
  .vip-tier-choice small { display:none; }
  .vip30-panel .vip-level-stop { flex-basis:74px;width:74px;min-height:92px;padding:8px 4px; }
  .vip30-panel .vip-level-stop>.vip-emblem { width:34px;height:34px; }
  .vip-level-controls>span { display:none; }
  .vip-target-metrics { gap:8px 3px; }
  .vip-level-metric>strong { font-size:16px; }
  .vip-benefit-matrix { padding:16px 12px;margin-top:16px; }
  .vip-benefit-matrix-heading>p { display:none; }
  .vip-benefit-table th:first-child { width:132px; }

  /* Presets need one selector; custom dates reveal their two fields on demand. */
  .sample-filter { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 8px;padding:12px;margin-bottom:14px; }
  .sample-filter:not(:has([name="period"] option[value="custom"]:checked))>.ui-field:has(input[type="date"]) { display:none; }
  .sample-filter>.btn { grid-column:1/-1;min-height:44px; }
  .sample-filter .ui-field { width:100%;min-width:0;gap:5px; }
  .sample-filter .ui-field:only-of-type { grid-column:1/-1; }
  .sample-filter:not(:has([name="category"],[name="filter"],[name="kind"]))>.ui-field:has([name="period"]) { grid-column:1/-1; }
  .sample-filter .sample-query-error { grid-column:1/-1; }
  .sample-filter :is(input,select) { min-height:44px;font-size:16px; }
  .sample-metrics { grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-bottom:14px; }
  .sample-metrics>div { padding:11px 8px; }
  .sample-metrics>div>small { font-size:10px;line-height:1.5;margin-bottom:6px; }
  .sample-metrics>div>strong { font-size:16px;line-height:1.4; }
  .sample-metrics .sample-money { display:flex;flex-wrap:wrap;gap:2px 4px;white-space:normal; }
  .sample-metrics .sample-currency { font-size:9px!important; }
  .sample-panel>.ui-panel-heading { margin-bottom:12px; }
  body:is([data-route="/records/transactions"],[data-route="/records/games"]) .sample-panel>.ui-panel-heading>h2 { display:none; }
  body:is([data-route="/records/transactions"],[data-route="/records/games"]) .sample-panel>.ui-panel-heading { min-height:26px;margin-bottom:6px; }
  .df-notice { padding:12px;margin:8px 0; }
  .df-notice summary { min-height:40px; }
  .df-notice-toolbar { margin-top:12px; }
  .sample-table-wrap::before,.vip30-table-wrap::before,.vip-rebate-wrap::before,.vip-benefit-table-wrap::before {
    content:'左右滑動查看完整資料';display:block;position:sticky;left:0;
    padding:0 0 10px;color:#8eb7aa;font-size:11px;line-height:1.5;
  }

  /* Browseable content uses short list cards rather than repeated desktop introductions. */
  .route-page .campaign-grid>.campaign-illustrated { display:grid;grid-template-columns:112px minmax(0,1fr); }
  .route-page .campaign-grid>.campaign-illustrated>.campaign-image { aspect-ratio:auto;height:100%;max-height:none; }
  .route-page .campaign-grid>.campaign-illustrated>.campaign-body { padding:12px; }
  .route-page .campaign-grid>.campaign-illustrated .campaign-body h2 { font-size:16px;margin:5px 0 6px; }
  .route-page .campaign-grid>.campaign-illustrated .campaign-body p { font-size:12px;line-height:1.6;margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden; }
  .route-page .campaign-grid>.campaign-illustrated .card-action { font-size:12px; }
  .route-page .campaign-grid>.campaign-illustrated .page-tag { font-size:10px; }
  .campaign-detail-copy>.page-tag,.campaign-detail-copy>h2 { display:none; }
  .help-topic-grid>.info-card { position:relative;min-height:112px;padding:16px; }
  .help-topic-grid>.info-card>h2 { margin:10px 0 0;font-size:15px; }
  .help-topic-grid>.info-card>p,.help-topic-grid>.info-card>.card-action { display:none; }
  .site-document section p,.faq-list details p { font-size:14px;line-height:1.85; }
  .game-detail.has-insights.is-combined-preview { grid-template-columns:96px minmax(0,1fr);gap:16px;padding:16px; }
  .game-detail.has-insights.is-combined-preview>.detail-art { width:96px;max-width:100%;height:auto;min-height:0;margin:0;justify-self:start;align-self:start; }
  .game-detail.has-insights.is-combined-preview>.detail-copy h2 { font-size:20px;margin:0 0 8px; }
  .game-detail.has-insights.is-combined-preview>.detail-copy>.page-tag { display:none; }
  .game-detail.has-insights.is-combined-preview>.detail-copy p { font-size:13px;line-height:1.7; }
  .game-detail.has-insights.is-combined-preview>.detail-copy dl { margin-block:12px; }
  .game-detail.has-insights.is-combined-preview>.detail-copy dl>div { grid-template-columns:50px minmax(0,1fr);gap:8px;font-size:12px; }
  .game-detail.has-insights.is-combined-preview>.game-insights-preview { grid-column:1/-1; }
  .game-detail.has-insights.is-combined-preview .detail-actions { display:grid;grid-template-columns:minmax(0,1fr);gap:8px;margin-top:12px; }
  .game-detail.has-insights.is-combined-preview .detail-actions .btn { width:100%;min-height:44px;font-size:13px; }
  footer .footer-brand p { display:none; }
}

@media (max-width:760px) and (max-height:720px) {
  dialog.account-modal { --account-gap:6px;--account-tabs-size:42px; }
  dialog.account-modal .account-content { padding-block:10px max(10px,env(safe-area-inset-bottom,0px)); }
  dialog.account-modal .account-referral summary { min-height:32px; }
  dialog.account-modal .account-consent { min-height:36px; }
}
@media (max-width:760px) and (max-height:680px) {
  dialog.account-modal { --account-banner-size:148px;--account-field-size:44px;--account-field-gap:3px;--account-tabs-size:40px;--account-gap:5px; }
  dialog.account-modal .account-content { padding-top:8px;padding-bottom:max(8px,env(safe-area-inset-bottom,0px)); }
  dialog.account-modal .account-input>input { padding-block:8px; }
  dialog.account-modal .account-password-toggle { height:40px; }
}
@media (max-width:760px) and (max-height:620px) {
  dialog.account-modal { --account-banner-size:128px; }
}
@media (max-width:760px) and (max-height:560px) {
  dialog.account-modal { --account-banner-size:88px; }
  dialog.account-modal .account-banner-slide { padding-block:8px 22px; }
}
