/* Responsive fixes for the existing KingLudo interface. */
:root { letter-spacing: 0; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid #24bfa5; outline-offset: 3px; }
.auth-page { grid-template-columns: minmax(0,1fr) minmax(0,.86fr); }
.auth-panel, .auth-card, .auth-field, .auth-input-wrap { min-width: 0; max-width: 100%; box-sizing: border-box; }
.auth-card { width: 100%; }
.auth-input-wrap input { min-width: 0; width: 100%; flex: 1 1 0; font-size: 16px; }
.auth-input-wrap > i, .auth-input-wrap .country-code { flex-shrink: 0; }
.auth-submit, .auth-secondary { width: 100%; min-width: 0; min-height: 46px; font-size: 14px; white-space: normal; }
.auth-card h2 { overflow-wrap: anywhere; }
.site-brand, .drawer-brand { gap: 7px; }
.site-brand img { width: 38px; height: 38px; flex-shrink: 0; }
.site-brand .king-brand-name { font-family: inherit; font-size: 16px; font-weight: 750; letter-spacing: 0; }
.drawer-brand .king-brand-name { font-family: inherit; font-size: 18px; letter-spacing: 0; }
.site-drawer:not(.open) { visibility: hidden; pointer-events: none; }
.site-drawer.open { visibility: visible; pointer-events: auto; }
.nav-actions, .nav-wallet, .nav-wallet strong { min-width: 0; }
.nav-left { flex-shrink: 0; }
.nav-wallet { max-width: 165px; }
.nav-wallet strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.desktop-nav a { font-size: 13px; }
.header-theme-button, .theme-toggle { min-width: 40px; min-height: 40px; }
.game-grid:has(> .arena-card:only-child) { grid-template-columns: minmax(0,1fr); }
.classic-match-row { min-width: 0; flex-wrap: wrap; gap: 12px; }
.classic-player { flex: 1 1 140px; min-width: 0; }
.classic-player strong { max-width: none; font-family: inherit; font-size: 14px; overflow-wrap: anywhere; }
.classic-player small { font-size: 10px; letter-spacing: 0; }
.classic-match-header .match-status, .finding-player, .classic-requested { font-size: 12px; letter-spacing: 0; }
.classic-match-header > strong { font-size: 17px; }
.classic-match-actions { flex-wrap: wrap; gap: 8px; margin-left: auto; }
.classic-match-actions button { min-height: 42px; padding: 0 14px; border-radius: 6px; font-size: 13px; }
.running-match-card { min-width: 0; }
.running-player { min-width: 0; }
.running-player div { min-width: 0; }
.running-player strong { font-family: inherit; font-size: 13px; }
.running-player small { font-size: 10px; letter-spacing: 0; }
.running-versus strong { font-size: 17px; }
.running-live { font-size: 10px; letter-spacing: 0; }
.matches-page .create-match-panel button, .matches-page .create-match-panel input { min-height: 44px; font-size: 15px; }
.matches-empty { margin: 8px 0 24px; padding: 20px 0; text-align: center; color: var(--muted,#8494ab); font-size: 14px; }
.sample-matches { padding-top: 24px; margin-top: 24px; border-top: 1px solid var(--line,#314057); }
.sample-matches h3 { font-size: 18px; letter-spacing: 0; }
.sample-matches > p { color: var(--muted,#8494ab); font-size: 13px; margin-bottom: 16px; }
.match-room-page .btn { min-height: 44px; font-size: 14px; }
.match-room-page .card, .match-room-page .card-body { min-width: 0; }
.match-versus-panel .vstack { min-width: 0; }
.match-versus-panel .text-truncate { max-width: 100%; }
.match-room-page .room-code-panel h1 { font-size: 32px; letter-spacing: 0; font-variant-numeric: tabular-nums; }
.wallet-page a, .wallet-page button, .history-page button { font-size: 13px; min-height: 40px; }
.deposit-page button, .withdraw-page button, .refer-page button, .service-page button { font-size: 14px; min-height: 44px; }
.deposit-presets { gap: 6px; }
.deposit-presets button { font-size: 12px; padding: 9px 3px; }
.auth-legal, .auth-legal a, .form-security { font-size: 12px; }
.deposit-safety > p, .deposit-safety > div, .withdraw-summary ul, .deposit-safety ul, .refer-steps p { font-size: 13px; line-height: 1.6; }
.history-search input { font-size: 14px; min-height: 42px; }
.history-pagination span, .transaction-main > span, .transaction-date, .transaction-amount > span { font-size: 12px; }
.transaction-main > strong, .transaction-amount > strong { font-size: 14px; }
.transaction-main, .transaction-date, .transaction-amount { min-width: 0; overflow-wrap: anywhere; }
.transaction-row { gap: 12px; }
.history-page, .history-list, .history-row, .history-toolbar, .profile-page, .wallet-page { min-width: 0; }
.history-row { overflow-wrap: anywhere; }
.history-row > * { min-width: 0; }
.mobile-bottom-nav a { font-size: 11px; letter-spacing: 0; }
.mobile-bottom-nav { height: calc(72px + env(safe-area-inset-bottom)); }
body:has(.match-room-page) .mobile-bottom-nav { display: none !important; }
.match-room-page { padding-bottom: calc(24px + env(safe-area-inset-bottom)) !important; }
@media (max-width: 900px) { .auth-page { grid-template-columns: minmax(0,1fr); } }
@media (max-width: 1100px) { .desktop-nav, .install-action, .nav-avatar { display: none !important; } .nav-inner { gap: 12px; } }
@media (max-width: 600px) {
  .site-brand { gap: 4px; }
  .site-brand img { width: 30px; height: 32px; }
  .site-brand .king-brand-name { font-size: 14px; }
  .site-header .btn, .header-actions a { font-size: 12px; }
  .auth-panel { width: 100%; padding: 28px 16px 36px; }
  .auth-card { margin-top: 8px; }
  .classic-player strong { max-width: 100%; font-size: 13px; }
  .classic-player { flex-basis: 125px; }
  .classic-match-actions button { padding: 0 12px; }
  .running-match-card { padding: 16px 12px; }
  .running-player strong { font-size: 12px; }
  .running-player small { font-size: 9px; }
  .running-versus { flex-shrink: 0; }
  .running-versus strong { font-size: 15px; }
  .running-player img { width: 32px; height: 32px; }
  .match-room-page, .history-page, .wallet-page, .matches-page, .profile-page, .refer-page, .withdraw-page, .deposit-page { padding-bottom: calc(100px + env(safe-area-inset-bottom)); }
}
@media (max-width: 380px) {
  .nav-inner { padding-left: 10px; padding-right: 10px; gap: 8px; }
  .nav-left { gap: 5px; }
  .nav-actions { gap: 6px; }
  .site-brand img { width: 24px; height: 30px; }
  .site-brand .king-brand-name { font-size: 12px; }
  .theme-toggle { min-width: 34px; width: 34px; min-height: 38px; }
  .nav-wallet { gap: 4px; padding: 6px; }
  .nav-wallet strong { font-size: 11px; }
  .nav-register { padding: 10px 8px; font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; } }
.qr-payment-card .payment-amount { display: block; margin-bottom: 12px; font-size: 24px; font-variant-numeric: tabular-nums; }
.qr-payment-card .payment-paytm { display: flex; justify-content: center; align-items: center; gap: 10px; width: 100%; min-height: 52px; padding: 12px; border: 1px solid #bbd4e7; border-radius: 8px; background: #fff; color: #002970; font-size: 14px; font-weight: 600; text-decoration: none; letter-spacing: 0; box-sizing: border-box; }
.qr-payment-card .payment-paytm img { width: 72px; height: 24px; object-fit: contain; }
.qr-payment-card .payment-paytm:disabled, .qr-payment-card .upi-apps button:disabled { opacity: .55; cursor: not-allowed; }
.qr-payment-card .upi-apps > * { display: inline-flex; justify-content: center; align-items: center; min-height: 40px; min-width: 76px; padding: 8px 12px; color: var(--text); border: 1px solid var(--line); border-radius: 8px; background: #ffffff08; font-size: 12px; text-decoration: none; }
.qr-payment-card .payment-order { font-size: 11px; overflow-wrap: anywhere; margin: 12px 0; }
.qr-payment-card .qr-frame[hidden] { display: none !important; }
.qr-payment-card .checking-payment > span { min-width: 0; overflow-wrap: anywhere; }
.qr-payment-card .checking-payment strong { line-height: 1.5; }
.qr-payment-card .checking-payment strong { font-size: 14px; }
.qr-payment-card .payment-timer span { font-size: 12px; }
.qr-payment-card .payment-timer strong { font-size: 13px; }
.qr-payment-card .checking-payment { display: flex; align-items: flex-start; gap: 12px; text-align: left; padding: 16px 0; }
.qr-payment-card .checking-payment > i, .qr-payment-card .checking-payment > .spinner-border { flex: 0 0 20px; margin-top: 3px; }
.qr-payment-card .checking-payment > i { font-size: 20px; line-height: 1; }
.qr-payment-card .checking-payment strong, .qr-payment-card .checking-payment small { display: block; }
.qr-payment-card .checking-payment small { margin-top: 5px; font-size: 12px; line-height: 1.6; color: var(--muted,#8494ab); }
.qr-payment-card .payment-state-failed > i { color: #e56464; }
.qr-payment-card .payment-state-review > i, .qr-payment-card .payment-state-expired > i { color: #d7a23d; }
.payment-state-actions { display: flex; flex-wrap: wrap; gap: 10px; padding-top: 8px; }
.payment-state-actions > *, .previous-payment-notice button, .king-load-notice button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; border: 1px solid var(--line,#48505a); border-radius: 6px; padding: 10px 14px; background: transparent; color: var(--text,#e6eaf0); text-decoration: none; font-size: 13px; font-weight: 600; }
.payment-state-actions > * { flex: 1 1 135px; }
.payment-state-actions > *:hover, .previous-payment-notice button:hover, .king-load-notice button:hover { background: #8494ab15; }
.previous-payment-notice { padding: 14px 0; border-bottom: 1px solid var(--line,#48505a); margin-bottom: 18px; font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.previous-payment-notice p { color: var(--muted,#8494ab); margin: 6px 0 12px; }
.deposit-page .deposit-safety { background: #20252c; color: #f2f4f6; border-color: #3a424c; }
.deposit-page .deposit-safety h2 { color: #f2f4f6; }
.deposit-page .deposit-safety p, .deposit-page .deposit-safety ul, .deposit-page .deposit-safety > div { color: #d0d6df; }
.support-order-context { border-top: 1px solid var(--line,#48505a); border-bottom: 1px solid var(--line,#48505a); padding: 20px 0; margin-bottom: 24px; overflow-wrap: anywhere; }
.support-order-context p { margin: 6px 0; font-size: 13px; }
.support-order-context small { color: var(--muted,#8494ab); line-height: 1.6; }
.king-load-notice { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 142px; width: 100%; padding: 20px 0; grid-column: 1 / -1; color: var(--text,#e6eaf0); }
.king-load-notice p { margin: 0; font-size: 14px; line-height: 1.6; max-width: 320px; }
.king-load-notice > i { flex: 0 0 24px; font-size: 22px; color: var(--muted,#8494ab); }
.king-load-notice button { padding: 10px; width: 44px; flex: 0 0 44px; font-size: 19px; }
.withdraw-page .withdraw-summary > span { font-size: 13px; color: #cbd3de; }
.withdraw-page .withdraw-speed b { font-size: 14px; color: #fff; }
.withdraw-page .withdraw-speed small { font-size: 12px; color: #cbd3de; line-height: 1.6; }
.withdraw-page .modern-field > span { font-size: 13px; }
.withdraw-page .modern-field > small { font-size: 12px; }
.withdraw-page .method-block > span, .withdraw-page .method-switch b { font-size: 13px; }
.withdraw-page .method-switch small { font-size: 12px; }
.withdraw-page .method-switch button { min-width: 0; min-height: 64px; padding: 12px; }
.withdraw-page .method-switch button > span { min-width: 0; overflow-wrap: anywhere; }
.support-page .support-hero h1, .support-page .support-status strong { color: #f5f7fb; }
.support-page .support-hero p, .support-page .support-status small { color: #d0d6e2; font-size: 13px; line-height: 1.6; }
.support-page .support-status strong { font-size: 14px; }
.support-page .support-channel small { font-size: 11px; }
.support-page .support-channel h3 { font-size: 19px; }
.support-page .support-channel p { font-size: 13px; line-height: 1.6; }
.support-page .support-channel b { color: #c2b4ff; font-size: 14px; }
html[data-theme=light] .support-page .support-channel b { color: #6540c5; }
.match-room-page .saved-result-notice { margin: 0 0 16px; font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.games-arena .game-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 220px)); gap: 12px; justify-content: start; }
.games-arena .arena-mode-card { display: flex; align-items: center; gap: 12px; min-width: 0; min-height: 100px; height: 100px; padding: 14px; border-radius: 8px; background: #151b25; text-decoration: none; }
.games-arena .arena-mode-card::before, .games-arena .arena-mode-card::after { display: none; }
.games-arena .arena-mode-card > img { position: static; width: 56px; height: 64px; border-radius: 6px; object-fit: cover; flex: 0 0 56px; }
.games-arena .arena-mode-card .mode-game-icon { width: 56px; height: 64px; display: grid; place-items: center; flex: 0 0 56px; background: #16392e; color: #65e5a3; border-radius: 6px; font-size: 32px; }
.games-arena .arena-mode-card .mode-game-content { display: flex; align-items: center; gap: 8px; min-width: 0; flex: 1; }
.games-arena .arena-mode-card h3 { font-size: 17px; line-height: 1.35; margin: 0; color: #fff; overflow-wrap: anywhere; letter-spacing: 0; }
.games-arena .arena-mode-card .mode-game-content > i { color: #a8b4c2; margin-left: auto; }
.games-arena .arena-mode-card > img.popular-game-art { object-fit: contain; background: #202324; }
.match-list-heading h1 { display: flex; align-items: center; gap: 12px; }
.mode-heading-image { width: 48px; height: 48px; flex: 0 0 48px; border-radius: 6px; object-fit: contain; }
@media (max-width: 480px) {
  .games-arena .game-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .games-arena .arena-mode-card { flex-direction: column; align-items: flex-start; padding: 12px; gap: 10px; height: 142px; min-height: 142px; }
  .games-arena .arena-mode-card h3 { font-size: 15px; }
  .games-arena .arena-mode-card .mode-game-content { width: 100%; }
}

.ui-history .history-toolbar { display:flex;flex-direction:row;align-items:flex-start;flex-wrap:wrap;gap:14px; }
.ui-history .history-filters { flex:1 1 100%;flex-wrap:wrap; }
.ui-history .history-search { flex:1 1 100%;width:100%;height:44px;min-height:44px;max-height:44px; }
.ui-history .history-search input { height:42px; }
.history-date-filters { display:flex;flex-wrap:wrap;align-items:end;gap:10px;width:100%; }
.history-date-filters label { display:flex;flex-direction:column;gap:5px;flex:1 1 140px;min-width:0;font-size:12px; }
.history-date-filters input,.history-date-filters select { box-sizing:border-box;width:100%;min-width:0;min-height:44px;padding:8px;border:1px solid var(--line,#667085);border-radius:6px;background:var(--surface,#fff);color:var(--text,#172033);font:inherit;font-size:14px; }
.history-date-filters input[type=date] { color-scheme:dark; }
[data-theme=light] .history-date-filters input[type=date] { color-scheme:light; }
.history-date-filters button,.ui-history .history-pagination button { min-height:44px;padding:9px 14px;border:1px solid var(--line,#667085);border-radius:6px;background:var(--surface,#fff);color:var(--text,#172033); }
.ui-history .history-pagination { display:flex;align-items:center;justify-content:space-between;gap:10px; }
.ui-history .history-pagination button:disabled { opacity:.45;cursor:not-allowed; }
.ui-history .transaction-row { display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:start;gap:10px; }
.ui-history .transaction-main { display:flex;flex-direction:column;gap:4px; }
.ui-history .transaction-main>strong { white-space:normal;overflow:visible;text-overflow:clip;line-height:1.5; }
.history-entry-time { display:block;font-size:12px;line-height:1.5;color:var(--muted,#667085); }
.ui-history .transaction-amount { max-width:140px;text-align:right; }
.ui-history .transaction-amount.neutral strong { color:var(--text,#475467); }
.history-entry-details { grid-column:2 / -1;min-width:0;font-size:12px; }
.history-entry-details summary { display:list-item;min-height:40px;padding:9px 0;cursor:pointer; }
.history-entry-details dl { margin:0;padding:10px 0;border-top:1px solid var(--line,#667085); }
.history-entry-details dl>div { margin-bottom:8px; }
.history-entry-details dt { font-weight:600; }
.history-entry-details dd { margin:3px 0;overflow-wrap:anywhere; }
.history-entry-details code { color:inherit;user-select:all;white-space:normal; }
.history-filter-error { margin:0;font-size:13px;color:#dc3545; }
.withdraw-validation,.deposit-limits { display:block;font-size:13px;line-height:1.5;margin:8px 0 12px;color:var(--muted,#667085); }
.withdraw-submit:disabled { opacity:.5;cursor:not-allowed; }
@media(max-width:480px) {
 .ui-history .transaction-row { grid-template-columns:30px minmax(0,1fr) minmax(76px,auto);gap:8px; }
 .ui-history .transaction-main>strong,.ui-history .transaction-amount>strong { font-size:13px; }
 .ui-history .transaction-amount { max-width:105px; }
 .history-date-filters label { flex-basis:calc(50% - 10px); }
 .history-date-filters button { flex:1 1 100%; }
 .history-entry-details { grid-column:1 / -1; }
}
