.agent-report-independent-page {
  container-type: inline-size;
}

.agent-mobile-detail-list {
  display: grid;
  gap: 9px;
}

.agent-mobile-detail-card {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid #e3c98d;
  border-radius: 12px;
  background: #fffdfa;
}

.agent-mobile-detail-card > div {
  min-width: 0;
  padding: 9px 10px;
  display: grid;
  gap: 3px;
  border-right: 1px solid #eee4cf;
  border-bottom: 1px solid #eee4cf;
}

.agent-mobile-detail-card > div:nth-child(2n) { border-right: 0; }
.agent-mobile-detail-card > div:nth-last-child(-n + 2) { border-bottom: 0; }
.agent-mobile-detail-card small { color: #7a7a70; font-size: 10px; }
.agent-mobile-detail-card strong { min-width: 0; color: #263e61; font-size: 12px; overflow-wrap: anywhere; }
.agent-mobile-detail-card strong.is-loss { color: #f5222d; }

@media (max-width: 768px) {
  .agent-report-independent-page .agent-detail-section table,
  .agent-report-independent-page .agent-detail-section tbody {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .agent-report-independent-page .agent-detail-section thead {
    display: none !important;
  }

  .agent-report-independent-page .agent-detail-section tr {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100% !important;
    min-width: 0 !important;
    border-bottom: 1px solid #e3c98d;
  }

  .agent-report-independent-page .agent-detail-section td {
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
    width: auto !important;
    min-width: 0 !important;
    padding: 9px 8px !important;
    border-bottom: 0 !important;
    font-size: 11px !important;
    line-height: 1.3;
    overflow-wrap: anywhere;
  }

  .agent-report-independent-page .agent-detail-section td::before {
    color: #7a7a70;
    font-size: 9px;
    font-weight: 500;
  }

  .agent-report-independent-page .agent-company-daily-detail td:nth-child(1)::before { content: "游戏平台组"; }
  .agent-report-independent-page .agent-company-daily-detail td:nth-child(2)::before { content: "Sales (USD)"; }
  .agent-report-independent-page .agent-company-daily-detail td:nth-child(3)::before { content: "Payout (USD)"; }
  .agent-report-independent-page .agent-company-daily-detail td:nth-child(4)::before { content: "Net Profit (USD)"; }

  .agent-report-independent-page .agent-contribution-detail td:nth-child(1)::before { content: "类型"; }
  .agent-report-independent-page .agent-contribution-detail td:nth-child(2)::before { content: "ID"; }
  .agent-report-independent-page .agent-contribution-detail td:nth-child(3)::before { content: "名称"; }
  .agent-report-independent-page .agent-contribution-detail td:nth-child(4)::before { content: "流水 (USD)"; }
  .agent-report-independent-page .agent-contribution-detail td:nth-child(5)::before { content: "推荐佣金"; }
  .agent-report-independent-page .agent-contribution-detail td:nth-child(6)::before { content: "盈利贡献"; }

  .agent-report-independent-page .agent-turnover-only-detail td:nth-child(1)::before { content: "Game Platform"; }
  .agent-report-independent-page .agent-turnover-only-detail td:nth-child(2)::before { content: "Game"; }
  .agent-report-independent-page .agent-turnover-only-detail td:nth-child(3)::before { content: "Currency"; }
  .agent-report-independent-page .agent-turnover-only-detail td:nth-child(4)::before { content: "Source turnover"; }
  .agent-report-independent-page .agent-turnover-only-detail td:nth-child(5)::before { content: "Sales (USD)"; }
  .agent-report-independent-page .agent-turnover-only-detail td:nth-child(6)::before { content: "ShareHolding NetProfit"; }

  .agent-report-independent-page .agent-company-scoped-report td:nth-child(1)::before { content: "账号"; }
  .agent-report-independent-page .agent-company-scoped-report td:nth-child(2)::before { content: "游戏平台组"; }
  .agent-report-independent-page .agent-company-scoped-report td:nth-child(3)::before { content: "Sales (USD)"; }
  .agent-report-independent-page .agent-company-scoped-report td:nth-child(4)::before { content: "Payout (USD)"; }
  .agent-report-independent-page .agent-company-scoped-report td:nth-child(5)::before { content: "Net Profit (USD)"; }
  .agent-report-independent-page .agent-share-scoped-report td:nth-child(1)::before { content: "账号"; }
  .agent-report-independent-page .agent-share-scoped-report td:nth-child(2)::before { content: "代理名称"; }
  .agent-report-independent-page .agent-share-scoped-report td:nth-child(3)::before { content: "游戏平台组"; }
  .agent-report-independent-page .agent-share-scoped-report td:nth-child(4)::before { content: "Sales (USD)"; }
  .agent-report-independent-page .agent-share-scoped-report td:nth-child(5)::before { content: "持股份额"; }
  .agent-report-independent-page .agent-share-scoped-report td:nth-child(6)::before { content: "股份净盈利"; }

  .agent-report-independent-page .agent-detail-section td[colspan] {
    grid-column: 1 / -1;
  }
}

/* The report detail is also embedded inside a desktop shell on some Android
   browsers. Size it from its own panel, not only from the browser viewport. */
@container (max-width: 768px) {
  .agent-detail-section table,
  .agent-detail-section tbody {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .agent-detail-section thead { display: none !important; }

  .agent-detail-section tr {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100% !important;
    min-width: 0 !important;
    border-bottom: 1px solid #e3c98d;
  }

  .agent-detail-section td {
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
    width: auto !important;
    min-width: 0 !important;
    padding: 9px 8px !important;
    border-bottom: 0 !important;
    font-size: 11px !important;
    line-height: 1.3;
    overflow-wrap: anywhere;
  }

  .agent-detail-section td::before {
    color: #7a7a70;
    font-size: 9px;
    font-weight: 500;
  }

  .agent-company-daily-detail td:nth-child(1)::before { content: "游戏平台组"; }
  .agent-company-daily-detail td:nth-child(2)::before { content: "Sales (USD)"; }
  .agent-company-daily-detail td:nth-child(3)::before { content: "Payout (USD)"; }
  .agent-company-daily-detail td:nth-child(4)::before { content: "Net Profit (USD)"; }
  .agent-contribution-detail td:nth-child(1)::before { content: "类型"; }
  .agent-contribution-detail td:nth-child(2)::before { content: "ID"; }
  .agent-contribution-detail td:nth-child(3)::before { content: "名称"; }
  .agent-contribution-detail td:nth-child(4)::before { content: "流水 (USD)"; }
  .agent-contribution-detail td:nth-child(5)::before { content: "推荐佣金"; }
  .agent-contribution-detail td:nth-child(6)::before { content: "盈利贡献"; }
  .agent-turnover-only-detail td:nth-child(1)::before { content: "Game Platform"; }
  .agent-turnover-only-detail td:nth-child(2)::before { content: "Game"; }
  .agent-turnover-only-detail td:nth-child(3)::before { content: "Currency"; }
  .agent-turnover-only-detail td:nth-child(4)::before { content: "Source turnover"; }
  .agent-turnover-only-detail td:nth-child(5)::before { content: "Sales (USD)"; }
  .agent-turnover-only-detail td:nth-child(6)::before { content: "ShareHolding NetProfit"; }
  .agent-company-scoped-report td:nth-child(1)::before { content: "账号"; }
  .agent-company-scoped-report td:nth-child(2)::before { content: "游戏平台组"; }
  .agent-company-scoped-report td:nth-child(3)::before { content: "Sales (USD)"; }
  .agent-company-scoped-report td:nth-child(4)::before { content: "Payout (USD)"; }
  .agent-company-scoped-report td:nth-child(5)::before { content: "Net Profit (USD)"; }
  .agent-share-scoped-report td:nth-child(1)::before { content: "账号"; }
  .agent-share-scoped-report td:nth-child(2)::before { content: "代理名称"; }
  .agent-share-scoped-report td:nth-child(3)::before { content: "游戏平台组"; }
  .agent-share-scoped-report td:nth-child(4)::before { content: "Sales (USD)"; }
  .agent-share-scoped-report td:nth-child(5)::before { content: "持股份额"; }
  .agent-share-scoped-report td:nth-child(6)::before { content: "股份净盈利"; }
  .agent-turnover-only-detail td:nth-child(5)::before { content: "Sales (USD)"; }
  .agent-detail-section td[colspan] { grid-column: 1 / -1; }
}