.screen-reader-text{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
:root {
  --dot-bg: #f7f8fc;
  --dot-surface: #ffffff;
  --dot-surface-alt: #f1f4fb;
  --dot-text: #132033;
  --dot-text-soft: #5d6b82;
  --dot-border: rgba(19, 32, 51, 0.1);
  --dot-border-strong: rgba(19, 32, 51, 0.18);
  --dot-shadow: 0 14px 36px rgba(15, 23, 42, 0.08);
  --dot-shadow-soft: 0 8px 20px rgba(15, 23, 42, 0.05);
  --dot-primary: #1d4ed8;
  --dot-primary-strong: #1e40af;
  --dot-primary-soft: rgba(29, 78, 216, 0.1);
  --dot-accent: #0f172a;
  --dot-success: #15803d;
  --dot-success-soft: rgba(21, 128, 61, 0.12);
  --dot-warning: #b45309;
  --dot-warning-soft: rgba(180, 83, 9, 0.12);
  --dot-danger: #b91c1c;
  --dot-danger-soft: rgba(185, 28, 28, 0.12);
  --dot-info: #0369a1;
  --dot-info-soft: rgba(3, 105, 161, 0.12);
  --dot-radius-xl: 24px;
  --dot-radius-lg: 18px;
  --dot-radius-md: 14px;
  --dot-radius-sm: 10px;
  --dot-gap: 1rem;
}

[data-theme="dark"],
.dot-theme-dark {
  --dot-bg: #09111f;
  --dot-surface: #0f172a;
  --dot-surface-alt: #162033;
  --dot-text: #eef4ff;
  --dot-text-soft: #a7b4ca;
  --dot-border: rgba(255, 255, 255, 0.08);
  --dot-border-strong: rgba(255, 255, 255, 0.14);
  --dot-shadow: 0 16px 40px rgba(0, 0, 0, 0.34);
  --dot-shadow-soft: 0 10px 24px rgba(0, 0, 0, 0.2);
  --dot-primary-soft: rgba(96, 165, 250, 0.16);
  --dot-success-soft: rgba(34, 197, 94, 0.16);
  --dot-warning-soft: rgba(251, 191, 36, 0.14);
  --dot-danger-soft: rgba(248, 113, 113, 0.14);
  --dot-info-soft: rgba(56, 189, 248, 0.16);
}

.dot-portal-shell,
.dot-portal,
.dot-account-shell,
.dot-wallet-shell,
.dot-referral-shell {
  width: min(1200px, 100%);
  margin: 0 auto;
  padding: 1.25rem;
  color: var(--dot-text);
}

/* Force the plugin UI to stay readable even when the site/theme toggles dark mode. */
.dot-ui-shell,
.dot-portal-shell,
.dot-portal,
.dot-account-shell,
.dot-wallet-shell,
.dot-referral-shell {
  color-scheme: light;
  --dot-bg: #f7f8fc;
  --dot-surface: #ffffff;
  --dot-surface-alt: #f1f4fb;
  --dot-text: #132033;
  --dot-text-soft: #5d6b82;
  --dot-border: rgba(19, 32, 51, 0.1);
  --dot-border-strong: rgba(19, 32, 51, 0.18);
}

.dot-ui-shell,
.dot-ui-shell h1,
.dot-ui-shell h2,
.dot-ui-shell h3,
.dot-ui-shell h4,
.dot-ui-shell p,
.dot-ui-shell strong,
.dot-ui-shell span,
.dot-ui-shell label,
.dot-ui-shell li,
.dot-ui-shell button,
.dot-ui-shell a,
.dot-ui-shell .dot-pred-card,
.dot-ui-shell .dot-stat-card,
.dot-ui-shell .dot-testimonial,
.dot-ui-shell .dot-tabs a,
.dot-ui-shell .dot-icon-btn,
.dot-ui-shell .dot-share-menu,
.dot-ui-shell .dot-share-menu button,
.dot-ui-shell .dot-share-menu a {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}

.dot-ui-shell .dot-home-head,
.dot-ui-shell .dot-home-head *,
.dot-ui-shell .dot-result-badge {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.dot-ui-shell .dot-home-note,
.dot-ui-shell .dot-stat-label,
.dot-ui-shell .dot-arena-meta,
.dot-ui-shell .dot-empty,
.dot-ui-shell .dot-share-help,
.dot-ui-shell .dot-share-subhint {
  color: #64748b !important;
  -webkit-text-fill-color: #64748b !important;
}

.dot-ui-shell .dot-tabs a.active {
  color: #251808 !important;
  -webkit-text-fill-color: #251808 !important;
}

.dot-portal-section,
.dot-panel,
.dot-account-panel,
.dot-wallet-panel,
.dot-referral-panel,
.dot-pricing-section,
.dot-subscribe-section {
  margin: 0 0 1.5rem;
  padding: 1.25rem;
  background: var(--dot-surface);
  border: 1px solid var(--dot-border);
  border-radius: var(--dot-radius-xl);
  box-shadow: var(--dot-shadow-soft);
}

.dot-card-grid,
.dot-prediction-grid,
.dot-ticket-grid,
.dot-wallet-grid,
.dot-referral-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1rem;
}

.dot-card,
.dot-prediction-card,
.dot-ticket-card,
.dot-wallet-card,
.dot-referral-card,
.dot-summary-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
  padding: 1rem;
  background: var(--dot-surface);
  border: 1px solid var(--dot-border);
  border-radius: var(--dot-radius-lg);
  box-shadow: var(--dot-shadow-soft);
  color: var(--dot-text);
}

.dot-card.is-active,
.dot-plan-card.is-active,
.dot-subscribe-tier-group .is-active,
.dot-tier-option.is-active,
.dot-card.is-selected,
.dot-plan-card.is-selected {
  border-color: var(--dot-primary);
  box-shadow: 0 0 0 3px var(--dot-primary-soft), var(--dot-shadow);
}

.dot-card.is-disabled,
.dot-plan-card.is-disabled,
.is-disabled,
[aria-disabled="true"] {
  opacity: 0.56;
  filter: grayscale(0.08);
}

.dot-card-head,
.dot-card-header,
.dot-ticket-head,
.dot-prediction-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

.dot-card-body,
.dot-ticket-body,
.dot-prediction-body {
  display: grid;
  gap: 0.75rem;
}

.dot-card-footer,
.dot-ticket-footer,
.dot-prediction-footer,
.dot-summary-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: auto;
}

.dot-card-meta,
.dot-meta-row,
.dot-card-row,
.dot-odds-row,
.dot-result-row,
.dot-detail-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.65rem 0.8rem;
  background: var(--dot-surface-alt);
  border: 1px solid var(--dot-border);
  border-radius: var(--dot-radius-sm);
}

.dot-card-meta strong,
.dot-meta-row strong,
.dot-card-row strong,
.dot-odds-row strong,
.dot-result-row strong,
.dot-detail-row strong {
  color: var(--dot-text);
}

.dot-card-meta small,
.dot-meta-row small,
.dot-muted,
.dot-helper-text,
.dot-text-muted {
  color: var(--dot-text-soft);
}

.dot-card-actions {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.dot-action-toggle,
.dot-share-toggle,
.dot-print-btn,
.dot-action-btn,
.dot-card-action {
  appearance: none;
  border: 1px solid var(--dot-border-strong);
  background: var(--dot-surface-alt);
  color: var(--dot-text);
  border-radius: 999px;
  min-height: 2.5rem;
  padding: 0.65rem 0.95rem;
  font: inherit;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.dot-action-toggle:hover,
.dot-share-toggle:hover,
.dot-print-btn:hover,
.dot-action-btn:hover,
.dot-card-action:hover {
  border-color: var(--dot-primary);
  background: var(--dot-primary-soft);
  transform: translateY(-1px);
}

.dot-card.is-actions-open .dot-action-toggle,
.dot-pred-card.is-actions-open .dot-action-toggle,
.dot-prediction-card.is-actions-open .dot-action-toggle,
.dot-ticket-card.is-actions-open .dot-action-toggle,
.dot-plan-card.is-actions-open .dot-action-toggle,
.dot-card.is-share-open .dot-share-toggle,
.dot-pred-card.is-share-open .dot-share-toggle,
.dot-prediction-card.is-share-open .dot-share-toggle,
.dot-ticket-card.is-share-open .dot-share-toggle,
.dot-plan-card.is-share-open .dot-share-toggle {
  border-color: var(--dot-primary);
  background: var(--dot-primary-soft);
}

.dot-share-wrap {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
}

.dot-action-menu,
.dot-share-menu,
.dot-menu-shell {
  position: absolute;
  top: calc(100% + 0.5rem);
  right: 0;
  z-index: 30;
  min-width: 220px;
  padding: 0.5rem;
  background: var(--dot-surface);
  border: 1px solid var(--dot-border-strong);
  border-radius: var(--dot-radius-md);
  box-shadow: var(--dot-shadow);
  display: none;
}

.dot-share-menu[hidden],
.dot-action-menu[hidden] {
  display: none !important;
}

.dot-card.is-actions-open .dot-action-menu,
.dot-pred-card.is-actions-open .dot-action-menu,
.dot-prediction-card.is-actions-open .dot-action-menu,
.dot-ticket-card.is-actions-open .dot-action-menu,
.dot-plan-card.is-actions-open .dot-action-menu,
.dot-card.is-share-open .dot-share-menu,
.dot-pred-card.is-share-open .dot-share-menu,
.dot-prediction-card.is-share-open .dot-share-menu,
.dot-ticket-card.is-share-open .dot-share-menu,
.dot-plan-card.is-share-open .dot-share-menu,
.dot-menu-shell.is-open {
  display: grid;
  gap: 0.35rem;
}

.dot-action-menu button,
.dot-action-menu a,
.dot-share-menu button,
.dot-share-menu a,
.dot-menu-item {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  width: 100%;
  text-decoration: none;
  border: 0;
  background: #ffffff !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  border-radius: var(--dot-radius-sm);
  padding: 0.7rem 0.8rem;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
  text-align: left;
  opacity: 1 !important;
  visibility: visible !important;
  cursor: pointer;
}

.dot-share-menu {
  background: #ffffff !important;
  color: #0f172a !important;
}

.dot-share-save-group {
  display: grid;
  gap: 0.35rem;
}

.dot-share-subtoggle::after {
  content: "▾";
  margin-left: auto;
  font-size: 0.85em;
}

.dot-share-save-group.is-open .dot-share-subtoggle::after {
  content: "▴";
}

.dot-share-submenu {
  display: none;
  gap: 0.35rem;
  margin-left: 0.35rem;
  padding-left: 0.55rem;
  border-left: 2px solid var(--dot-border);
}

.dot-share-save-group.is-open .dot-share-submenu,
.dot-share-submenu:not([hidden]) {
  display: grid;
}

.dot-share-submenu button {
  padding-left: 1rem;
}

.dot-action-menu button:hover,
.dot-action-menu a:hover,
.dot-share-menu button:hover,
.dot-share-menu a:hover,
.dot-menu-item:hover {
  background: var(--dot-surface-alt);
}

.dot-menu-group-title {
  padding: 0.45rem 0.8rem 0.25rem;
  color: var(--dot-text-soft);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.dot-menu-separator {
  height: 1px;
  margin: 0.35rem 0;
  background: var(--dot-border);
}

.dot-menu-item.is-danger,
.dot-action-menu .is-danger,
.dot-share-menu .is-danger {
  color: var(--dot-danger);
}

.dot-menu-item.is-danger:hover,
.dot-action-menu .is-danger:hover,
.dot-share-menu .is-danger:hover {
  background: var(--dot-danger-soft);
}

.dot-copy-success,
.is-copied {
  color: var(--dot-success);
}

.dot-pricing-grid,
.dot-plan-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1rem;
}

.dot-plan-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
  min-height: 100%;
  padding: 1.25rem;
  background: var(--dot-surface);
  border: 1px solid var(--dot-border);
  border-radius: var(--dot-radius-xl);
  box-shadow: var(--dot-shadow-soft);
}

.dot-plan-card--legacy,
.dot-plan-card.legacy,
.dot-legacy-card {
  background: linear-gradient(180deg, var(--dot-surface) 0%, var(--dot-primary-soft) 100%);
  border-color: rgba(29, 78, 216, 0.26);
}

.dot-plan-card--legacy::before,
.dot-legacy-card::before {
  content: "Legacy";
  position: absolute;
  top: 1rem;
  right: 1rem;
  padding: 0.35rem 0.6rem;
  border-radius: 999px;
  background: var(--dot-primary);
  color: #fff;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.dot-duration-switch,
.dot-pricing-duration-switch,
.dot-plan-duration-row {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0.4rem;
  background: var(--dot-surface-alt);
  border: 1px solid var(--dot-border);
  border-radius: 999px;
}

.dot-duration-switch [data-dot-duration],
.dot-pricing-duration-switch [data-dot-duration],
.dot-plan-duration-row [data-dot-duration] {
  border: 0;
  background: transparent;
  color: var(--dot-text-soft);
  border-radius: 999px;
  padding: 0.55rem 0.9rem;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.dot-duration-switch [data-dot-duration].active,
.dot-pricing-duration-switch [data-dot-duration].active,
.dot-plan-duration-row [data-dot-duration].active {
  background: var(--dot-primary);
  color: #fff;
}

.dot-plan-price,
.dot-price-stack,
.dot-subscribe-price-summary,
.dot-pricing-summary {
  display: grid;
  gap: 0.35rem;
}

.dot-plan-price-value,
.dot-price-amount,
[data-dot-price-week],
[data-dot-price-month],
[data-dot-price-year] {
  font-size: clamp(1.65rem, 2.5vw, 2.3rem);
  font-weight: 800;
  line-height: 1.05;
  color: var(--dot-text);
}

.dot-plan-feature-list,
.dot-plan-card ul,
.dot-card ul,
.dot-included-arenas-list {
  margin: 0;
  padding-left: 1.1rem;
  display: grid;
  gap: 0.45rem;
}

.dot-plan-feature-list li,
.dot-included-arenas-list li {
  color: var(--dot-text-soft);
}

.dot-subscribe-tier-group {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.85rem;
}

.dot-subscribe-tier-group > label,
.dot-subscribe-tier-group > .dot-tier-option {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  padding: 1rem;
  background: var(--dot-surface);
  border: 1px solid var(--dot-border);
  border-radius: var(--dot-radius-lg);
  box-shadow: var(--dot-shadow-soft);
  cursor: pointer;
}

.dot-subscribe-arena-picker,
.dot-arena-picker,
.dot-subscribe-arena-block {
  display: grid;
  gap: 0.5rem;
  padding: 1rem;
  background: var(--dot-surface-alt);
  border: 1px dashed var(--dot-border-strong);
  border-radius: var(--dot-radius-lg);
}

.dot-subscribe-arena-picker.is-disabled,
.dot-subscribe-arena-picker[aria-disabled="true"],
.dot-arena-picker.is-disabled,
.dot-subscribe-arena-block.is-disabled {
  opacity: 0.55;
}

.dot-disabled-note,
.dot-picker-help,
.dot-field-help,
.dot-help-text {
  color: var(--dot-text-soft);
  font-size: 0.86rem;
  line-height: 1.45;
}

.dot-wallet-summary,
.dot-referral-summary,
.dot-dashboard-summary,
.dot-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1rem;
}

.dot-wallet-summary .dot-card,
.dot-referral-summary .dot-card,
.dot-dashboard-summary .dot-card,
.dot-summary-grid .dot-card {
  min-height: 140px;
}

.dot-filter-bar,
.dot-table-filters,
.dot-status-filter-pills {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin-bottom: 1rem;
}

.dot-filter-pill,
.dot-status-pill,
.dot-filter-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2rem;
  padding: 0.35rem 0.8rem;
  border-radius: 999px;
  border: 1px solid var(--dot-border);
  background: var(--dot-surface-alt);
  color: var(--dot-text);
  font-size: 0.84rem;
  font-weight: 700;
}

.dot-filter-pill.is-active,
.dot-status-pill.is-active,
.dot-filter-chip.is-active {
  border-color: var(--dot-primary);
  background: var(--dot-primary-soft);
  color: var(--dot-primary-strong);
}

.dot-data-table,
.dot-wallet-table,
.dot-referral-table,
.dot-history-table,
.dot-portal-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--dot-surface);
  border: 1px solid var(--dot-border);
  border-radius: var(--dot-radius-lg);
  overflow: hidden;
}

.dot-data-table thead,
.dot-wallet-table thead,
.dot-referral-table thead,
.dot-history-table thead,
.dot-portal-table thead {
  background: var(--dot-surface-alt);
}

.dot-data-table th,
.dot-data-table td,
.dot-wallet-table th,
.dot-wallet-table td,
.dot-referral-table th,
.dot-referral-table td,
.dot-history-table th,
.dot-history-table td,
.dot-portal-table th,
.dot-portal-table td {
  padding: 0.85rem 0.9rem;
  border-bottom: 1px solid var(--dot-border);
  text-align: left;
  vertical-align: top;
}

.dot-data-table tbody tr:last-child td,
.dot-wallet-table tbody tr:last-child td,
.dot-referral-table tbody tr:last-child td,
.dot-history-table tbody tr:last-child td,
.dot-portal-table tbody tr:last-child td {
  border-bottom: 0;
}

.dot-data-table tbody tr:hover,
.dot-wallet-table tbody tr:hover,
.dot-referral-table tbody tr:hover,
.dot-history-table tbody tr:hover,
.dot-portal-table tbody tr:hover {
  background: rgba(29, 78, 216, 0.04);
}

.dot-table-empty,
.dot-empty-state {
  padding: 1rem;
  text-align: center;
  color: var(--dot-text-soft);
  background: var(--dot-surface-alt);
  border: 1px dashed var(--dot-border-strong);
  border-radius: var(--dot-radius-lg);
}

.dot-status-tracked,
.dot-status-pending,
.dot-status-approved,
.dot-status-available,
.dot-status-withdrawn,
.dot-status-rejected,
.dot-status-reversed,
.dot-badge-tracked,
.dot-badge-pending,
.dot-badge-approved,
.dot-badge-available,
.dot-badge-withdrawn,
.dot-badge-rejected,
.dot-badge-reversed {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  min-height: 1.9rem;
  padding: 0.3rem 0.75rem;
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 700;
  border: 1px solid transparent;
  white-space: nowrap;
}

.dot-status-tracked,
.dot-badge-tracked {
  color: var(--dot-info);
  background: var(--dot-info-soft);
  border-color: rgba(3, 105, 161, 0.22);
}

.dot-status-pending,
.dot-badge-pending {
  color: var(--dot-warning);
  background: var(--dot-warning-soft);
  border-color: rgba(180, 83, 9, 0.22);
}

.dot-status-approved,
.dot-status-available,
.dot-badge-approved,
.dot-badge-available {
  color: var(--dot-success);
  background: var(--dot-success-soft);
  border-color: rgba(21, 128, 61, 0.22);
}

.dot-status-withdrawn,
.dot-badge-withdrawn {
  color: var(--dot-primary-strong);
  background: var(--dot-primary-soft);
  border-color: rgba(29, 78, 216, 0.24);
}

.dot-status-rejected,
.dot-status-reversed,
.dot-badge-rejected,
.dot-badge-reversed {
  color: var(--dot-danger);
  background: var(--dot-danger-soft);
  border-color: rgba(185, 28, 28, 0.2);
}

.dot-plan-card button,
.dot-plan-card .button,
.dot-card button,
.dot-card .button,
.dot-portal-section button,
.dot-portal-section .button,
.dot-panel button,
.dot-panel .button {
  border-radius: 999px;
}

.dot-plan-card h3,
.dot-card h3,
.dot-portal-section h2,
.dot-portal-section h3,
.dot-panel h2,
.dot-panel h3 {
  margin: 0;
  color: var(--dot-text);
}

@media (max-width: 820px) {
  .dot-portal-shell,
  .dot-portal,
  .dot-account-shell,
  .dot-wallet-shell,
  .dot-referral-shell {
    padding: 1rem;
  }

  .dot-portal-section,
  .dot-plan-card,
  .dot-card,
  .dot-panel,
  .dot-account-panel,
  .dot-wallet-panel,
  .dot-referral-panel,
  .dot-pricing-section,
  .dot-subscribe-section {
    padding: 1rem;
  }
}

@media (max-width: 600px) {
  .dot-card-actions,
  .dot-card-footer,
  .dot-ticket-footer,
  .dot-prediction-footer,
  .dot-summary-actions {
    justify-content: stretch;
  }

  .dot-action-toggle,
  .dot-share-toggle,
  .dot-print-btn,
  .dot-action-btn,
  .dot-card-action {
    flex: 1 1 auto;
    justify-content: center;
  }

  .dot-action-menu,
  .dot-share-menu,
  .dot-menu-shell {
    left: 0;
    right: 0;
    min-width: 0;
  }

  .dot-wallet-summary,
  .dot-referral-summary,
  .dot-pricing-grid,
  .dot-card-grid,
  .dot-subscribe-tier-group,
  .dot-dashboard-summary,
  .dot-summary-grid,
  .dot-plan-grid,
  .dot-wallet-grid,
  .dot-referral-grid,
  .dot-ticket-grid,
  .dot-prediction-grid {
    grid-template-columns: 1fr;
  }

  .dot-card-meta,
  .dot-meta-row,
  .dot-card-row,
  .dot-odds-row,
  .dot-result-row,
  .dot-detail-row {
    flex-direction: column;
    align-items: flex-start;
  }

  .dot-data-table,
  .dot-wallet-table,
  .dot-referral-table,
  .dot-history-table,
  .dot-portal-table {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
  }
}
/* DOT v2 betting-app refresh */
.dot-ui-shell,
.dot-ui-shell *,
.dot-home-wrap,
.dot-home-wrap * {
  box-sizing: border-box;
}

.dot-ui-shell {
  color: #0f172a !important;
}

.dot-ui-shell .dot-home-wrap,
.dot-ui-shell .dot-panel,
.dot-ui-shell .dot-pred-card,
.dot-ui-shell .dot-testimonial,
.dot-ui-shell .dot-stat-card,
.dot-ui-shell .dot-arena-card {
  color: #0f172a !important;
}

.dot-ui-shell .dot-tabs a,
.dot-ui-shell .dot-control-field input,
.dot-ui-shell .dot-control-field select,
.dot-ui-shell .dot-icon-btn,
.dot-ui-shell .dot-share-item,
.dot-ui-shell .dot-share-link {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}

.dot-ui-shell .dot-match-title,
.dot-ui-shell .dot-odds-value,
.dot-ui-shell .dot-pick-box strong,
.dot-ui-shell .dot-meta-tile strong,
.dot-ui-shell .dot-tab-count {
  text-shadow: none !important;
}

.dot-ui-shell .dot-share-menu {
  backdrop-filter: blur(14px);
}

.dot-ui-shell .dot-share-submenu {
  margin-top: 6px;
}

.dot-ui-shell .dot-tabs a.active {
  box-shadow: 0 16px 30px rgba(212, 175, 55, 0.22);
}

.dot-ui-shell .dot-pred-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 48px rgba(15, 23, 42, 0.12);
}

.dot-ui-shell .dot-meta-tile .dot-result-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 640px) {
  .dot-ui-shell .dot-home-wrap {
    padding: 12px !important;
  }

  .dot-ui-shell .dot-tabs {
    gap: 8px;
  }

  .dot-ui-shell .dot-share-menu {
    width: min(92vw, 320px);
  }
}

/* v2.1.0 responsive frontend hardening */
.dot-ui-shell,
.dot-portal-shell,
.dot-portal,
.dot-account-shell,
.dot-wallet-shell,
.dot-referral-shell,
.dot-panel,
.dot-portal-section,
.dot-pricing-section,
.dot-subscribe-section {
  width: min(100%, 1200px);
  max-width: 100%;
  overflow-x: clip;
}

.dot-ui-shell *,
.dot-portal-shell *,
.dot-portal *,
.dot-account-shell *,
.dot-wallet-shell *,
.dot-referral-shell * {
  box-sizing: border-box;
}

.dot-ui-shell img,
.dot-ui-shell iframe,
.dot-ui-shell table,
.dot-portal-shell img,
.dot-portal-shell iframe,
.dot-portal-shell table {
  max-width: 100%;
}

.dot-device-toolbar {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  align-items: center;
  margin: 0 0 1rem;
  padding: 0.75rem;
  border: 1px solid var(--dot-border);
  border-radius: var(--dot-radius-md);
  background: var(--dot-surface-alt);
}

.dot-device-toolbar__label {
  font-size: 12px;
  font-weight: 700;
  color: var(--dot-text-soft);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.dot-device-toolbar [data-dot-device-mode].is-active {
  border-color: var(--dot-primary);
  background: var(--dot-primary-soft);
}

[data-dot-device-root] {
  transition: max-width 0.18s ease;
}

[data-dot-device-root][data-dot-device-mode="mobile"] {
  max-width: 430px;
  margin-inline: auto;
}

[data-dot-device-root][data-dot-device-mode="tablet"] {
  max-width: 820px;
  margin-inline: auto;
}

[data-dot-device-root][data-dot-device-mode="desktop"] {
  max-width: 1180px;
  margin-inline: auto;
}

[data-dot-device-root][data-dot-device-mode="wide"] {
  max-width: 1440px;
  margin-inline: auto;
}

@media (max-width: 960px) {
  .dot-ui-shell,
  .dot-portal-shell,
  .dot-portal,
  .dot-account-shell,
  .dot-wallet-shell,
  .dot-referral-shell {
    padding: 1rem;
  }

  .dot-card-grid,
  .dot-prediction-grid,
  .dot-ticket-grid,
  .dot-wallet-grid,
  .dot-referral-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 640px) {
  .dot-ui-shell,
  .dot-portal-shell,
  .dot-portal,
  .dot-account-shell,
  .dot-wallet-shell,
  .dot-referral-shell,
  .dot-panel,
  .dot-portal-section,
  .dot-pricing-section,
  .dot-subscribe-section {
    padding: 0.85rem;
    border-radius: 18px;
  }

  .dot-card,
  .dot-prediction-card,
  .dot-ticket-card,
  .dot-wallet-card,
  .dot-referral-card,
  .dot-summary-card {
    padding: 0.85rem;
  }

  .dot-card-meta,
  .dot-meta-row,
  .dot-card-row,
  .dot-odds-row,
  .dot-result-row,
  .dot-detail-row,
  .dot-card-footer,
  .dot-ticket-footer,
  .dot-prediction-footer,
  .dot-summary-actions {
    flex-direction: column;
    align-items: flex-start;
  }

  .dot-ui-shell input,
  .dot-ui-shell select,
  .dot-ui-shell textarea,
  .dot-ui-shell button,
  .dot-portal-shell input,
  .dot-portal-shell select,
  .dot-portal-shell textarea,
  .dot-portal-shell button {
    max-width: 100%;
  }
}

/* DOT 2.2 dense responsive terminal override */
:root {
  --dot-radius-xl: 16px;
  --dot-radius-lg: 12px;
  --dot-radius-md: 10px;
  --dot-radius-sm: 8px;
  --dot-gap: 0.75rem;
}

html[data-dot-device-mode],
body[data-dot-device-mode] {
  overflow-x: hidden;
}

.dot-ui-shell,
.dot-portal-shell,
.dot-portal,
.dot-account-shell,
.dot-wallet-shell,
.dot-referral-shell,
.dot-device-preview-shell,
[data-dot-device-root] {
  max-width: 100%;
  min-width: 0;
}

.dot-ui-shell *,
.dot-portal-shell *,
.dot-portal *,
.dot-account-shell *,
.dot-wallet-shell *,
.dot-referral-shell * {
  box-sizing: border-box;
}

.dot-panel,
.dot-card,
.dot-box,
.dot-section,
.dot-widget,
.dot-stat-card,
.dot-pred-card,
.dot-testimonial,
.dot-ticket-card,
.dot-wallet-card,
.dot-referral-card,
.dot-summary-card,
.dot-pricing-section,
.dot-subscribe-section,
.dot-portal-section {
  max-width: 100%;
  min-width: 0;
}

.dot-card,
.dot-prediction-card,
.dot-ticket-card,
.dot-wallet-card,
.dot-referral-card,
.dot-summary-card,
.dot-stat-card,
.dot-testimonial,
.dot-panel,
.dot-portal-section,
.dot-pricing-section,
.dot-subscribe-section {
  padding: 0.75rem;
  border-radius: 12px;
}

.dot-ui-shell h1,
.dot-ui-shell h2,
.dot-ui-shell h3,
.dot-portal-shell h1,
.dot-portal-shell h2,
.dot-portal-shell h3,
.dot-portal h1,
.dot-portal h2,
.dot-portal h3 {
  margin-bottom: 0.5rem;
  line-height: 1.2;
}

.dot-ui-shell p,
.dot-portal-shell p,
.dot-portal p,
.dot-account-shell p,
.dot-wallet-shell p,
.dot-referral-shell p {
  margin-top: 0;
  margin-bottom: 0.625rem;
}

.dot-device-toolbar {
  position: sticky;
  top: 0;
  z-index: 5;
  gap: 0.375rem;
  padding: 0.625rem;
  border-radius: 12px;
}

.dot-device-toolbar .dot-action-btn,
.dot-device-toolbar button {
  padding: 0.4rem 0.7rem;
  line-height: 1.1;
  font-size: 12px;
  border-radius: 999px;
  white-space: nowrap;
}

[data-dot-device-root] {
  width: min(100%, var(--dot-device-width, 100%));
  margin-inline: auto;
}

[data-dot-device-root][data-dot-device-mode="auto"] {
  --dot-device-width: 100%;
}

[data-dot-device-root][data-dot-device-mode="mobile"] {
  --dot-device-width: 390px;
}

[data-dot-device-root][data-dot-device-mode="mobile-browser"] {
  --dot-device-width: 430px;
}

[data-dot-device-root][data-dot-device-mode="tablet"] {
  --dot-device-width: 768px;
}

[data-dot-device-root][data-dot-device-mode="web"] {
  --dot-device-width: 1180px;
}

[data-dot-device-root][data-dot-device-mode="desktop"] {
  --dot-device-width: 1440px;
}

.dot-table-wrap,
.dot-table-scroll,
.dot-responsive-table,
.table-responsive {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.dot-ui-shell table,
.dot-portal-shell table,
.dot-portal table,
.dot-account-shell table,
.dot-wallet-shell table,
.dot-referral-shell table {
  width: 100%;
  max-width: 100%;
}

.dot-ui-shell th,
.dot-ui-shell td,
.dot-portal-shell th,
.dot-portal-shell td,
.dot-portal th,
.dot-portal td,
.dot-account-shell th,
.dot-account-shell td,
.dot-wallet-shell th,
.dot-wallet-shell td,
.dot-referral-shell th,
.dot-referral-shell td {
  padding: 0.45rem 0.5rem;
  font-size: 13px;
  vertical-align: top;
}

.dot-ui-shell input,
.dot-ui-shell select,
.dot-ui-shell textarea,
.dot-ui-shell button,
.dot-portal-shell input,
.dot-portal-shell select,
.dot-portal-shell textarea,
.dot-portal-shell button,
.dot-portal input,
.dot-portal select,
.dot-portal textarea,
.dot-portal button,
.dot-account-shell input,
.dot-account-shell select,
.dot-account-shell textarea,
.dot-account-shell button,
.dot-wallet-shell input,
.dot-wallet-shell select,
.dot-wallet-shell textarea,
.dot-wallet-shell button,
.dot-referral-shell input,
.dot-referral-shell select,
.dot-referral-shell textarea,
.dot-referral-shell button {
  max-width: 100%;
}

html[data-dot-device-mode="mobile"] .dot-card-grid,
html[data-dot-device-mode="mobile"] .dot-prediction-grid,
html[data-dot-device-mode="mobile"] .dot-ticket-grid,
html[data-dot-device-mode="mobile"] .dot-wallet-grid,
html[data-dot-device-mode="mobile"] .dot-referral-grid,
html[data-dot-device-mode="mobile-browser"] .dot-card-grid,
html[data-dot-device-mode="mobile-browser"] .dot-prediction-grid,
html[data-dot-device-mode="mobile-browser"] .dot-ticket-grid,
html[data-dot-device-mode="mobile-browser"] .dot-wallet-grid,
html[data-dot-device-mode="mobile-browser"] .dot-referral-grid {
  grid-template-columns: minmax(0, 1fr);
}

html[data-dot-device-mode="mobile"] table,
html[data-dot-device-mode="mobile-browser"] table {
  min-width: 640px;
}

/* DOT 2.3 compact device settings + high contrast */
:root {
  --dot-bg: #f4f7fb;
  --dot-surface: #ffffff;
  --dot-surface-alt: #e9eef5;
  --dot-text: #08111f;
  --dot-text-soft: #425268;
  --dot-border: rgba(8, 17, 31, 0.14);
  --dot-border-strong: rgba(8, 17, 31, 0.26);
  --dot-primary: #0f3cc9;
  --dot-primary-strong: #0a2f9c;
  --dot-primary-soft: rgba(15, 60, 201, 0.12);
  --dot-radius-xl: 14px;
  --dot-radius-lg: 10px;
  --dot-radius-md: 8px;
  --dot-radius-sm: 6px;
}

html[data-dot-device-mode],
body[data-dot-device-mode] {
  background: var(--dot-bg);
}

.dot-ui-shell,
.dot-portal-shell,
.dot-portal,
.dot-account-shell,
.dot-wallet-shell,
.dot-referral-shell,
[data-dot-device-root] {
  width: min(100%, var(--dot-device-width, 100%));
  max-width: 100%;
  min-width: 0;
  margin-inline: auto;
  overflow-x: clip;
  color: var(--dot-text) !important;
}

.dot-ui-shell,
.dot-portal-shell,
.dot-portal,
.dot-account-shell,
.dot-wallet-shell,
.dot-referral-shell {
  padding: 0.75rem;
}

.dot-panel,
.dot-card,
.dot-box,
.dot-section,
.dot-widget,
.dot-stat-card,
.dot-pred-card,
.dot-testimonial,
.dot-ticket-card,
.dot-wallet-card,
.dot-referral-card,
.dot-summary-card,
.dot-pricing-section,
.dot-subscribe-section,
.dot-portal-section {
  background: #fff !important;
  color: var(--dot-text) !important;
  border-color: var(--dot-border) !important;
  box-shadow: none !important;
}

.dot-ui-shell a,
.dot-portal-shell a,
.dot-portal a,
.dot-account-shell a,
.dot-wallet-shell a,
.dot-referral-shell a {
  color: #0b57d0;
}

.dot-home-head,
.dot-app-shell .dot-home-head,
.dot-ui-shell .dot-home-head {
  background: #08111f !important;
  color: #fff !important;
}

.dot-home-head *,
.dot-ui-shell .dot-home-head * {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

.dot-device-toolbar {
  position: fixed !important;
  right: 12px;
  bottom: 12px;
  top: auto !important;
  left: auto;
  z-index: 9999;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: nowrap;
  margin: 0;
  padding: 0.4rem;
  border: 1px solid rgba(8, 17, 31, 0.18);
  border-radius: 999px;
  background: rgba(255,255,255,0.96);
  box-shadow: 0 8px 24px rgba(8,17,31,0.18);
  backdrop-filter: blur(10px);
}

.dot-device-toolbar__label {
  display: none;
}

.dot-device-toolbar__settings,
.dot-device-toolbar [data-dot-device-mode] {
  min-width: 28px;
  min-height: 28px;
  width: 28px;
  height: 28px;
  padding: 0 !important;
  border-radius: 999px !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10px !important;
  font-weight: 800;
  letter-spacing: 0;
}

.dot-device-toolbar__settings {
  width: 30px;
  height: 30px;
  min-width: 30px;
  min-height: 30px;
  background: #08111f !important;
  color: #fff !important;
  border: 1px solid #08111f !important;
}

.dot-device-toolbar__panel {
  display: none;
  align-items: center;
  gap: 0.28rem;
}

.dot-device-toolbar.is-open .dot-device-toolbar__panel {
  display: inline-flex;
}

.dot-device-toolbar [data-dot-device-mode] {
  background: #fff !important;
  color: #08111f !important;
  border: 1px solid rgba(8,17,31,0.18) !important;
}

.dot-device-toolbar [data-dot-device-mode].is-active {
  background: #0f3cc9 !important;
  color: #fff !important;
  border-color: #0f3cc9 !important;
}

.dot-table-wrap,
.dot-table-scroll,
.table-responsive,
.dot-ui-shell table,
.dot-portal-shell table,
.dot-portal table,
.dot-account-shell table,
.dot-wallet-shell table,
.dot-referral-shell table {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.dot-ui-shell table,
.dot-portal-shell table,
.dot-portal table,
.dot-account-shell table,
.dot-wallet-shell table,
.dot-referral-shell table {
  width: 100%;
}

.dot-ui-shell input,
.dot-ui-shell select,
.dot-ui-shell textarea,
.dot-ui-shell button,
.dot-portal-shell input,
.dot-portal-shell select,
.dot-portal-shell textarea,
.dot-portal-shell button,
.dot-portal input,
.dot-portal select,
.dot-portal textarea,
.dot-portal button,
.dot-account-shell input,
.dot-account-shell select,
.dot-account-shell textarea,
.dot-account-shell button,
.dot-wallet-shell input,
.dot-wallet-shell select,
.dot-wallet-shell textarea,
.dot-wallet-shell button,
.dot-referral-shell input,
.dot-referral-shell select,
.dot-referral-shell textarea,
.dot-referral-shell button {
  max-width: 100%;
  min-width: 0;
}

html[data-dot-device-mode="mobile"] .dot-ui-shell,
html[data-dot-device-mode="mobile-browser"] .dot-ui-shell,
html[data-dot-device-mode="mobile"] .dot-portal-shell,
html[data-dot-device-mode="mobile-browser"] .dot-portal-shell,
html[data-dot-device-mode="mobile"] .dot-portal,
html[data-dot-device-mode="mobile-browser"] .dot-portal,
html[data-dot-device-mode="mobile"] .dot-account-shell,
html[data-dot-device-mode="mobile-browser"] .dot-account-shell,
html[data-dot-device-mode="mobile"] .dot-wallet-shell,
html[data-dot-device-mode="mobile-browser"] .dot-wallet-shell,
html[data-dot-device-mode="mobile"] .dot-referral-shell,
html[data-dot-device-mode="mobile-browser"] .dot-referral-shell {
  padding: 0.55rem;
}

html[data-dot-device-mode="mobile"] .dot-card-grid,
html[data-dot-device-mode="mobile"] .dot-prediction-grid,
html[data-dot-device-mode="mobile"] .dot-ticket-grid,
html[data-dot-device-mode="mobile"] .dot-wallet-grid,
html[data-dot-device-mode="mobile"] .dot-referral-grid,
html[data-dot-device-mode="mobile-browser"] .dot-card-grid,
html[data-dot-device-mode="mobile-browser"] .dot-prediction-grid,
html[data-dot-device-mode="mobile-browser"] .dot-ticket-grid,
html[data-dot-device-mode="mobile-browser"] .dot-wallet-grid,
html[data-dot-device-mode="mobile-browser"] .dot-referral-grid {
  grid-template-columns: minmax(0, 1fr) !important;
}

html[data-dot-device-mode="mobile"] .dot-card,
html[data-dot-device-mode="mobile"] .dot-panel,
html[data-dot-device-mode="mobile"] .dot-portal-section,
html[data-dot-device-mode="mobile"] .dot-pricing-section,
html[data-dot-device-mode="mobile"] .dot-subscribe-section,
html[data-dot-device-mode="mobile-browser"] .dot-card,
html[data-dot-device-mode="mobile-browser"] .dot-panel,
html[data-dot-device-mode="mobile-browser"] .dot-portal-section,
html[data-dot-device-mode="mobile-browser"] .dot-pricing-section,
html[data-dot-device-mode="mobile-browser"] .dot-subscribe-section {
  padding: 0.65rem !important;
}

html[data-dot-device-mode="mobile"] .dot-card-meta,
html[data-dot-device-mode="mobile"] .dot-meta-row,
html[data-dot-device-mode="mobile"] .dot-card-row,
html[data-dot-device-mode="mobile"] .dot-odds-row,
html[data-dot-device-mode="mobile"] .dot-result-row,
html[data-dot-device-mode="mobile"] .dot-detail-row,
html[data-dot-device-mode="mobile-browser"] .dot-card-meta,
html[data-dot-device-mode="mobile-browser"] .dot-meta-row,
html[data-dot-device-mode="mobile-browser"] .dot-card-row,
html[data-dot-device-mode="mobile-browser"] .dot-odds-row,
html[data-dot-device-mode="mobile-browser"] .dot-result-row,
html[data-dot-device-mode="mobile-browser"] .dot-detail-row {
  gap: 0.45rem;
  padding: 0.45rem 0.55rem;
}

@media (max-width: 640px) {
  .dot-device-toolbar {
    right: 8px;
    bottom: 8px;
  }
}


/* === Swaxis compact front patch === */
.dot-device-toolbar__settings{display:none!important}
.dot-device-toolbar .dot-device-toolbar__panel{display:flex!important;gap:8px!important;opacity:1!important;visibility:visible!important;position:static!important;background:transparent!important;box-shadow:none!important;padding:0!important;border:0!important}
.dot-device-toolbar{right:8px!important;bottom:8px!important;padding:8px 10px!important;gap:8px!important;border-radius:999px!important}
.dot-device-toolbar__label{font-size:11px!important;letter-spacing:.08em!important;text-transform:uppercase!important}
.dot-device-toolbar [data-dot-device-mode]{min-width:38px!important;height:38px!important;border-radius:999px!important;padding:0 10px!important}
.dot-ui-shell,.dot-portal-shell,.dot-portal,.dot-account-shell,.dot-wallet-shell,.dot-referral-shell{padding:10px!important;max-width:720px!important}
.dot-portal-shell h1,.dot-ui-shell h1,.dot-account-shell h1{font-size:24px!important;line-height:1.1!important}
.dot-portal-shell h2,.dot-ui-shell h2,.dot-account-shell h2,.dot-portal-shell h3,.dot-ui-shell h3,.dot-account-shell h3{font-size:18px!important;line-height:1.2!important}
.dot-portal-shell p,.dot-ui-shell p,.dot-account-shell p,.dot-portal-shell label,.dot-ui-shell label,.dot-account-shell label{font-size:14px!important;line-height:1.5!important}
.dot-portal-shell input,.dot-portal-shell select,.dot-portal-shell textarea,.dot-portal-shell button,.dot-account-shell input,.dot-account-shell select,.dot-account-shell textarea,.dot-account-shell button,.dot-ui-shell input,.dot-ui-shell select,.dot-ui-shell textarea,.dot-ui-shell button{min-height:40px!important;font-size:14px!important;padding:8px 12px!important}
.dot-card,.dot-panel,.dot-portal-section,.dot-pricing-section,.dot-subscribe-section,.dot-account-shell .widefat,.dot-ui-shell .widefat{border-radius:14px!important}
.dot-tabs{padding:10px!important;border-radius:18px!important}
.dot-tabs a{padding:8px 12px!important;font-size:13px!important}
.dot-tab-count{min-width:22px!important;height:22px!important;font-size:11px!important}
.dot-pred-toolbar,.dot-controls,.dot-card-grid,.dot-prediction-grid{gap:10px!important}
.dot-portal-shell .button,.dot-account-shell .button,.dot-ui-shell .button{width:auto!important}
@media (max-width:640px){.dot-portal-shell,.dot-ui-shell,.dot-account-shell,.dot-wallet-shell,.dot-referral-shell{padding:8px!important}.dot-card,.dot-panel,.dot-portal-section,.dot-pricing-section,.dot-subscribe-section{padding:12px!important}.dot-tabs{overflow-x:auto!important;display:flex!important;gap:8px!important;flex-wrap:nowrap!important}.dot-tabs a{flex:0 0 auto!important;white-space:nowrap!important}.dot-controls,.dot-payment-flow,.dot-account-shell .dot-card-grid,.dot-ui-shell .dot-card-grid{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}.dot-payment-flow select,.dot-payment-flow input,.dot-payment-flow button{width:100%!important;min-width:0!important}.dot-portal-shell table,.dot-account-shell table,.dot-ui-shell table{font-size:12px!important}}


/* === Swaxis footer device patch 2.3.2 === */
.dot-device-toolbar,
.dot-device-toolbar--footer,
.dot-device-toolbar--simple {
  position: static !important;
  inset: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  top: auto !important;
  z-index: auto !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 6px !important;
  margin: 12px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
.dot-device-toolbar__label { display: none !important; }
.dot-device-toolbar__panel { display: inline-flex !important; align-items: center !important; gap: 6px !important; }
.dot-device-toolbar [data-dot-device-mode] {
  min-width: 0 !important;
  width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.dot-device-icon{display:inline-flex;align-items:center;justify-content:center;font-size:14px;line-height:1;pointer-events:none}
.dot-device-toolbar [data-dot-device-mode].is-active{box-shadow:0 0 0 2px rgba(37,99,235,.18) inset!important}
[data-dot-device-root],
[data-dot-device-root][data-dot-device-mode="mobile"],
[data-dot-device-root][data-dot-device-mode="desktop"] {
  width: 100% !important;
  max-width: 100% !important;
  margin-inline: 0 !important;
}
html[data-dot-device-mode="mobile"] .dot-ui-shell,
html[data-dot-device-mode="mobile"] .dot-portal-shell,
html[data-dot-device-mode="mobile"] .dot-portal,
html[data-dot-device-mode="mobile"] .dot-account-shell,
html[data-dot-device-mode="mobile"] .dot-wallet-shell,
html[data-dot-device-mode="mobile"] .dot-referral-shell,
html[data-dot-device-mode="mobile"] .dot-home-wrap,
html[data-dot-device-mode="mobile"] .dot-public-shell,
html[data-dot-device-mode="mobile"] .dot-pricing-page {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 8px !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  background-image: none !important;
  box-shadow: none !important;
}
html[data-dot-device-mode="mobile"] .dot-card,
html[data-dot-device-mode="mobile"] .dot-panel,
html[data-dot-device-mode="mobile"] .dot-portal-section,
html[data-dot-device-mode="mobile"] .dot-pricing-section,
html[data-dot-device-mode="mobile"] .dot-subscribe-section,
html[data-dot-device-mode="mobile"] .dot-pred-card,
html[data-dot-device-mode="mobile"] .dot-stat-card,
html[data-dot-device-mode="mobile"] .dot-testimonial,
html[data-dot-device-mode="mobile"] .dot-ticket-card,
html[data-dot-device-mode="mobile"] .dot-wallet-card,
html[data-dot-device-mode="mobile"] .dot-referral-card,
html[data-dot-device-mode="mobile"] .dot-summary-card {
  padding: 10px !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  background-image: none !important;
  box-shadow: none !important;
}
html[data-dot-device-mode="mobile"] .dot-home-head,
html[data-dot-device-mode="mobile"] .dot-portal-hero {
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: none !important;
}
html[data-dot-device-mode="mobile"] .dot-home-head *,
html[data-dot-device-mode="mobile"] .dot-portal-hero * {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}
html[data-dot-device-mode="mobile"] .dot-card-grid,
html[data-dot-device-mode="mobile"] .dot-prediction-grid,
html[data-dot-device-mode="mobile"] .dot-ticket-grid,
html[data-dot-device-mode="mobile"] .dot-wallet-grid,
html[data-dot-device-mode="mobile"] .dot-referral-grid {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
}


/* === DOT unified shell bridge v2.4.2 === */
.dot-ui-shell{width:100%;max-width:100%}
.dot-ui-shell .dot-portal-shell,.dot-ui-shell .dot-public-shell,.dot-ui-shell .dot-auth-grid{max-width:100%}
.dot-ui-shell .dot-card,.dot-ui-shell .dot-panel,.dot-ui-shell .dot-portal-panel,.dot-ui-shell .dot-auth-card{border-radius:18px}
.dot-ui-shell .button,.dot-ui-shell button,.dot-ui-shell input[type=submit],.dot-ui-shell input[type=button]{border-radius:12px}
.dot-ui-shell .dot-portal-hero{border-radius:18px;padding:12px 14px}
.dot-ui-shell .dot-portal-tabs{gap:6px}
.dot-ui-shell .dot-portal-tab{min-height:38px;padding:8px 11px;border-radius:11px;font-size:12px}
.dot-ui-shell .dot-card-row,.dot-ui-shell .dot-list-row,.dot-ui-shell .dot-stat-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center}
.dot-ui-shell .dot-table-wrap{overflow:auto;-webkit-overflow-scrolling:touch;border-radius:16px}
.dot-ui-shell table{table-layout:auto}
.dot-ui-shell td,.dot-ui-shell th{vertical-align:top;overflow-wrap:anywhere;word-break:break-word}
.dot-ui-shell .dot-metric-grid,.dot-ui-shell .dot-summary-grid,.dot-ui-shell .dot-ref-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.dot-ui-shell .dot-ui-inline-actions{display:flex;gap:8px;flex-wrap:wrap}
.dot-ui-shell .dot-ui-section-title{margin:0 0 10px;font-size:24px;line-height:1.1;letter-spacing:-.02em}
.dot-ui-shell.dot-ui-style-a .dot-portal-shell,.dot-ui-shell.dot-ui-style-a .dot-card,.dot-ui-shell.dot-ui-style-a .dot-panel,.dot-ui-shell.dot-ui-style-a .dot-auth-card{background:linear-gradient(180deg,#fff 0%,#f8fafc 100%);border:1px solid rgba(15,23,42,.10);box-shadow:0 10px 24px rgba(15,23,42,.06)}
.dot-ui-shell.dot-ui-style-z .dot-portal-shell,.dot-ui-shell.dot-ui-style-z .dot-public-shell,.dot-ui-shell.dot-ui-style-z .dot-card,.dot-ui-shell.dot-ui-style-z .dot-panel,.dot-ui-shell.dot-ui-style-z .dot-auth-card,.dot-ui-shell.dot-ui-style-z .dot-portal-panel{background:linear-gradient(180deg,#0b111b 0%,#121a27 100%);border:1px solid rgba(148,163,184,.16);box-shadow:0 14px 34px rgba(0,0,0,.32);color:#f8fafc}
.dot-ui-shell.dot-ui-style-z a{color:#dce7f8}
.dot-ui-shell.dot-ui-style-z label,.dot-ui-shell.dot-ui-style-z p,.dot-ui-shell.dot-ui-style-z h1,.dot-ui-shell.dot-ui-style-z h2,.dot-ui-shell.dot-ui-style-z h3,.dot-ui-shell.dot-ui-style-z h4,.dot-ui-shell.dot-ui-style-z h5,.dot-ui-shell.dot-ui-style-z span,.dot-ui-shell.dot-ui-style-z li,.dot-ui-shell.dot-ui-style-z td,.dot-ui-shell.dot-ui-style-z th{color:#f8fafc}
.dot-ui-shell.dot-ui-style-z input,.dot-ui-shell.dot-ui-style-z select,.dot-ui-shell.dot-ui-style-z textarea{background:#0f1724;color:#f8fafc;border-color:rgba(148,163,184,.24)}
.dot-ui-shell.dot-ui-style-z .button-primary{background:#ffb11a;border-color:#ffb11a;color:#1f1300}
@media (max-width: 900px){
  .dot-ui-shell .dot-metric-grid,.dot-ui-shell .dot-summary-grid,.dot-ui-shell .dot-ref-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 640px){
  .dot-ui-shell .dot-portal-shell{padding:8px}
  .dot-ui-shell .dot-portal-panel,.dot-ui-shell .dot-auth-card,.dot-ui-shell .dot-card,.dot-ui-shell .dot-panel{padding:12px!important;border-radius:16px}
  .dot-ui-shell .dot-portal-title{font-size:20px}
  .dot-ui-shell .dot-metric-grid,.dot-ui-shell .dot-summary-grid,.dot-ui-shell .dot-ref-grid{grid-template-columns:1fr}
  .dot-ui-shell .dot-table-wrap table,.dot-ui-shell .dot-table-wrap thead,.dot-ui-shell .dot-table-wrap tbody,.dot-ui-shell .dot-table-wrap tr,.dot-ui-shell .dot-table-wrap th,.dot-ui-shell .dot-table-wrap td{display:block;width:100%}
  .dot-ui-shell .dot-table-wrap thead{display:none}
  .dot-ui-shell .dot-table-wrap tr{margin-bottom:10px;border:1px solid rgba(15,23,42,.10);border-radius:14px;background:rgba(255,255,255,.98);padding:10px}
  .dot-ui-shell.dot-ui-style-z .dot-table-wrap tr{background:#0f1724;border-color:rgba(148,163,184,.16)}
  .dot-ui-shell .dot-table-wrap td{border:none;padding:6px 0}
}