@media (max-width: 700px) {
  :root {
    --sc-mobile-navy: #123455;
    --sc-mobile-navy-2: #0d2944;
    --sc-mobile-blue: #245e91;
    --sc-mobile-gold: #c89517;
    --sc-mobile-text: #17212b;
    --sc-mobile-muted: #687789;
    --sc-mobile-line: #e4eaf0;
    --sc-mobile-bg: #f3f6fa;
    --sc-mobile-surface: #ffffff;
    --sc-mobile-soft: #f7f9fc;
    --sc-mobile-shadow: 0 10px 30px rgba(16, 42, 69, .075);
  }

  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    background:
      radial-gradient(circle at 50% -120px, rgba(36, 94, 145, .12), transparent 330px),
      var(--sc-mobile-bg);
  }

  body {
    padding:
      max(8px, env(safe-area-inset-top))
      0
      calc(30px + env(safe-area-inset-bottom));
    color: var(--sc-mobile-text);
    -webkit-tap-highlight-color: transparent;
  }

  button,
  select,
  input,
  a {
    touch-action: manipulation;
  }

  .sc-page,
  .sc-tab-panel,
  .sc-card,
  .sc-toolbar,
  .sc-tabs,
  .sc-start-block,
  .sc-schedule-container,
  .sc-schedule-table-wrap,
  .sc-ranking-container,
  .sc-player-results,
  .sc-import-controls,
  .sc-admin-form {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .sc-page {
    padding: 0 10px;
  }

  /* Top / hero */
  .sc-back-link {
    min-height: 38px;
    margin: 2px 0 9px 2px;
    padding: 7px 11px;
    border: 1px solid rgba(23, 58, 94, .11);
    border-radius: 999px;
    background: rgba(255, 255, 255, .78);
    box-shadow: 0 3px 12px rgba(16, 42, 69, .04);
    color: var(--sc-mobile-navy);
    font-size: .78rem;
    font-weight: 800;
    backdrop-filter: blur(10px);
  }

  .sc-header {
    margin: 0 0 11px;
  }

  .sc-hero {
    border: 1px solid rgba(255, 255, 255, .75);
    border-radius: 20px;
    box-shadow: 0 12px 30px rgba(15, 38, 61, .13);
  }

  .sc-hero-image {
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
  }

  /* Champion area: premium but compact on phone. */
  .sc-winners-celebration {
    margin: 11px 0 13px !important;
    padding: 17px 12px 13px !important;
    border-radius: 20px !important;
    border-color: rgba(200, 149, 23, .25) !important;
    box-shadow: var(--sc-mobile-shadow) !important;
  }

  .sc-winners-heading {
    margin-bottom: 12px !important;
  }

  .sc-winners-kicker {
    margin-bottom: 3px !important;
    font-size: .61rem !important;
    letter-spacing: .15em !important;
  }

  .sc-winners-heading h2 {
    font-size: 1.35rem !important;
    letter-spacing: -.03em !important;
  }

  .sc-winners-heading p {
    margin-top: 5px !important;
    max-width: 310px !important;
    font-size: .74rem !important;
    line-height: 1.45 !important;
  }

  .sc-winner-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    max-width: none !important;
  }

  .sc-winner-card {
    grid-template-columns: 52px minmax(0, 1fr) !important;
    gap: 11px !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 12px !important;
    border-radius: 15px !important;
    box-shadow: 0 5px 16px rgba(16, 42, 69, .07) !important;
  }

  .sc-winner-card[data-has-flag="true"] {
    background-image:
      linear-gradient(90deg, #fff 0%, rgba(255,255,255,.98) 43%, rgba(255,255,255,.79) 68%, rgba(255,255,255,.22) 100%),
      var(--sc-winner-flag) !important;
    background-size: 100% 100%, 55% 100% !important;
  }

  .sc-winner-trophy {
    width: 52px !important;
    height: 52px !important;
    border-radius: 14px !important;
    font-size: 1.72rem !important;
  }

  .sc-winner-label {
    font-size: .58rem !important;
  }

  .sc-winner-name {
    margin: 2px 0 5px !important;
    font-size: 1.02rem !important;
  }

  .sc-winner-stats {
    gap: 5px !important;
  }

  .sc-winner-stat {
    padding: 4px 6px !important;
    border-radius: 7px !important;
    font-size: .61rem !important;
  }

  .sc-winner-stat strong {
    font-size: .75rem !important;
  }

  /* Main filters become a compact app control row. */
  .sc-toolbar {
    display: grid;
    grid-template-columns: minmax(84px, .72fr) minmax(0, 1.65fr);
    gap: 8px;
    margin: 0 0 9px;
    padding: 9px;
    border: 1px solid rgba(218, 226, 235, .78);
    border-radius: 16px;
    background: rgba(255, 255, 255, .93);
    box-shadow: 0 5px 18px rgba(16, 42, 69, .055);
    backdrop-filter: blur(12px);
  }

  .sc-toolbar > *,
  .sc-tabs > *,
  .sc-import-controls > *,
  .sc-admin-form > *,
  .sc-player-item > * {
    min-width: 0;
    max-width: 100%;
  }

  .sc-select-group {
    gap: 4px;
  }

  .sc-select-group > span,
  .sc-ranking-stage-filter > span,
  .sc-schedule-stage-filter > span {
    padding-left: 2px;
    color: #6b7b8d !important;
    font-size: .61rem !important;
    font-weight: 900 !important;
    letter-spacing: .07em;
    text-transform: uppercase;
  }

  .sc-select-group select,
  .sc-ranking-stage-filter select,
  .sc-schedule-stage-filter select {
    min-height: 44px !important;
    border: 1px solid #dce4ec !important;
    border-radius: 11px !important;
    padding: 9px 31px 9px 10px !important;
    background-color: #f8fafc !important;
    color: var(--sc-mobile-navy) !important;
    font-size: .84rem !important;
    font-weight: 850 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.75);
  }

  /* Sticky app-like primary navigation. */
  .sc-tabs {
    position: sticky;
    top: max(6px, env(safe-area-inset-top));
    z-index: 60;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 4px;
    margin: 0 0 12px;
    padding: 5px;
    border: 1px solid rgba(206, 218, 229, .9);
    border-radius: 16px;
    background: rgba(236, 242, 247, .88);
    box-shadow: 0 8px 24px rgba(16, 42, 69, .10);
    backdrop-filter: blur(16px);
  }

  .sc-tab-button {
    display: grid;
    place-items: center;
    align-content: center;
    gap: 3px;
    min-height: 48px;
    padding: 6px 3px;
    border-radius: 12px;
    color: #506b83;
    font-size: .68rem;
    font-weight: 850;
    line-height: 1.06;
  }

  .sc-tab-button::before {
    display: block;
    font-size: .92rem;
    line-height: 1;
  }

  #scTabBtnSchedule::before { content: "▦"; }
  #scTabBtnPlayers::before { content: "♙"; }
  #scTabBtnRanking::before { content: "★"; }

  .sc-tab-button.active {
    background: linear-gradient(145deg, var(--sc-mobile-navy), var(--sc-mobile-blue));
    color: #fff;
    box-shadow: 0 6px 16px rgba(23, 58, 94, .22);
  }

  /* Content surfaces */
  .sc-tab-panel > .sc-card {
    margin-bottom: 12px;
  }

  .sc-card {
    margin-bottom: 12px;
    padding: 16px 13px;
    border: 1px solid rgba(220, 228, 236, .78);
    border-radius: 20px;
    background: var(--sc-mobile-surface);
    box-shadow: var(--sc-mobile-shadow);
  }

  .sc-section-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 3px;
    margin-bottom: 11px;
  }

  .sc-kicker {
    margin-bottom: 2px;
    color: #8290a0;
    font-size: .61rem;
    letter-spacing: .13em;
  }

  .sc-section-head h2 {
    color: var(--sc-mobile-navy);
    font-size: 1.22rem;
    line-height: 1.18;
    letter-spacing: -.025em;
  }

  .sc-meta {
    color: #7a8897;
    font-size: .72rem;
    font-weight: 700;
    line-height: 1.35;
  }

  /* Stage controls */
  .sc-schedule-stage-wrap,
  .sc-ranking-stage-wrap {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 7px !important;
    margin: 0 0 12px !important;
  }

  .sc-schedule-stage-filter,
  .sc-ranking-stage-filter {
    width: 100% !important;
    min-width: 0 !important;
    gap: 4px !important;
  }

  .sc-ranking-tiebreak-note {
    margin: 0 !important;
    padding: 8px 10px;
    border: 1px solid #e8edf2;
    border-radius: 10px;
    background: #f8fafc;
    color: #718093 !important;
    font-size: .65rem !important;
    line-height: 1.4 !important;
  }

  /* Player search */
  .sc-search-label {
    margin-bottom: 5px;
    color: #67788a;
    font-size: .67rem;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
  }

  #scPlayerSearch {
    min-height: 48px;
    padding: 11px 13px;
    border: 1px solid #dce4ec;
    border-radius: 13px;
    background: #f8fafc;
    color: var(--sc-mobile-text);
    font-size: .92rem;
    outline: none;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, .025);
  }

  #scPlayerSearch:focus {
    border-color: rgba(36, 94, 145, .55);
    box-shadow: 0 0 0 3px rgba(36, 94, 145, .10);
  }

  .sc-player-results {
    display: grid;
    gap: 7px;
    margin-top: 10px;
  }

  .sc-player-item {
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
    gap: 4px;
    width: 100%;
    min-width: 0;
    padding: 8px;
    border: 1px solid #e5ebf1;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 3px 11px rgba(16, 42, 69, .035);
  }

  .sc-player-item a,
  .sc-player-flag-name {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  .sc-player-item small {
    padding: 0 4px 2px;
    color: #8190a0;
    font-size: .65rem;
    font-weight: 700;
  }

  .sc-player-item .sc-player-flag-name {
    min-height: 46px !important;
    border-radius: 11px !important;
    font-size: .88rem !important;
  }

  .sc-empty,
  .sc-schedule-stage-empty {
    padding: 18px 14px !important;
    border: 1px dashed #dce4ec !important;
    border-radius: 13px !important;
    background: #f8fafc !important;
    color: #788696 !important;
    font-size: .78rem;
    line-height: 1.45;
    text-align: center;
  }

  /* Mobile tables become information cards, never horizontal tables. */
  .sc-ranking-container,
  .sc-schedule-table-wrap {
    overflow-x: visible !important;
  }

  .sc-page table {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
  }

  .sc-page table thead {
    display: none !important;
  }

  .sc-page table tbody {
    display: grid !important;
    width: 100%;
    min-width: 0;
    gap: 7px;
  }

  .sc-page table tbody tr {
    position: relative;
    display: grid !important;
    width: 100%;
    min-width: 0;
    overflow: hidden;
    border: 1px solid #e2e8ef;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 4px 14px rgba(16, 42, 69, .045);
  }

  .sc-page table tbody td {
    display: grid !important;
    grid-template-columns: minmax(60px, .45fr) minmax(0, 1fr);
    align-items: center;
    gap: 7px;
    width: 100%;
    min-width: 0 !important;
    max-width: 100%;
    padding: 8px 10px !important;
    border-bottom: 1px solid #eef2f6 !important;
    background: transparent;
    white-space: normal !important;
    text-align: left !important;
    overflow-wrap: anywhere;
    font-size: .79rem;
  }

  .sc-page table tbody td:last-child {
    border-bottom: 0 !important;
  }

  .sc-page table tbody td::before {
    content: attr(data-mobile-label);
    min-width: 0;
    color: #8290a0;
    font-size: .57rem;
    font-weight: 900;
    letter-spacing: .075em;
    line-height: 1.15;
    text-transform: uppercase;
  }

  .sc-page table tbody td > * {
    min-width: 0;
    max-width: 100%;
  }

  /* Schedule sections */
  .sc-schedule-container {
    gap: 11px;
  }

  .sc-start-block {
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
  }

  .sc-start-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 0 1px 7px;
    padding: 9px 11px;
    border: 1px solid #dfe7ef;
    border-radius: 12px;
    background: linear-gradient(135deg, #f8fafc, #edf3f8);
  }

  .sc-start-head strong {
    color: var(--sc-mobile-navy);
    font-size: .82rem;
    font-weight: 900;
  }

  .sc-start-head span {
    color: #748495;
    font-size: .65rem;
    font-weight: 750;
    text-align: right;
  }

  .sc-schedule-table tbody tr {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sc-schedule-table tbody td[data-mobile-label="Player"],
  .sc-schedule-table tbody td:nth-child(2) {
    grid-column: 1 / -1;
    grid-row: 1;
    min-width: 0 !important;
    padding: 7px !important;
    border-bottom: 1px solid #e8edf2 !important;
    background: #fafbfd;
  }

  .sc-schedule-table tbody td[data-mobile-label="Player"]::before,
  .sc-schedule-table tbody td:nth-child(2)::before {
    display: none;
  }

  .sc-schedule-table tbody td[data-mobile-label="Lane"],
  .sc-schedule-table tbody td:nth-child(1) {
    grid-column: 1;
    grid-row: 2;
  }

  .sc-schedule-table tbody td[data-mobile-label="Total"],
  .sc-schedule-table tbody td:nth-child(4) {
    grid-column: 2;
    grid-row: 2;
  }

  .sc-schedule-table tbody td[data-mobile-label="Country"],
  .sc-schedule-table tbody td:nth-child(3) {
    grid-column: 1 / -1;
  }

  .sc-schedule-table tbody td[data-mobile-label="Admin"] {
    grid-column: 1 / -1;
  }

  .sc-schedule-table tbody td[data-mobile-label="Result PDF"],
  .sc-schedule-table tbody td[data-sc-pdf-download-col] {
    grid-column: 1 / -1;
    border-bottom: 0 !important;
  }

  .sc-schedule-table .sc-player-flag-name {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 44px !important;
    padding: 9px 11px !important;
    border: 0 !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    font-size: .88rem !important;
  }

  .sc-schedule-total {
    min-width: 44px;
    justify-self: start;
    padding: 5px 9px;
    border-radius: 8px;
    font-size: .8rem;
  }

  .sc-schedule-total.has-result {
    background: #eaf7ef;
    color: #116437;
  }

  .sc-schedule-actions {
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  /* PDF actions read as primary actions on phone. */
  .sc-pdf-download-list {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px !important;
    width: 100%;
  }

  .sc-pdf-download-link {
    min-height: 38px !important;
    width: 100%;
    border-color: #dbe5ee !important;
    border-radius: 10px !important;
    background: #f4f8fb !important;
    color: var(--sc-mobile-navy) !important;
    font-size: .68rem !important;
  }

  /* Ranking cards */
  .sc-ranking-table tbody tr {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-top: 0;
  }

  .sc-ranking-table tbody td[data-mobile-label="Player"],
  .sc-ranking-table tbody td:nth-child(2) {
    grid-column: 1 / -1;
    grid-row: 1;
    padding: 7px !important;
    background: #fafbfd;
  }

  .sc-ranking-table tbody td[data-mobile-label="Player"]::before,
  .sc-ranking-table tbody td:nth-child(2)::before {
    display: none;
  }

  .sc-ranking-table tbody td[data-mobile-label="Place"],
  .sc-ranking-table tbody td:nth-child(1),
  .sc-ranking-table tbody td[data-mobile-label="Matches"],
  .sc-ranking-table tbody td:nth-child(3),
  .sc-ranking-table tbody td[data-mobile-label="Average"],
  .sc-ranking-table tbody td:nth-child(4),
  .sc-ranking-table tbody td[data-mobile-label="Clear"],
  .sc-ranking-table tbody td:nth-child(5),
  .sc-ranking-table tbody td[data-mobile-label="Best"],
  .sc-ranking-table tbody td:nth-child(6) {
    grid-column: auto;
  }

  .sc-ranking-table tbody td[data-mobile-label="Result PDFs"],
  .sc-ranking-table tbody td[data-sc-pdf-download-col] {
    grid-column: 1 / -1;
    border-bottom: 0 !important;
  }

  .sc-ranking-table .sc-player-flag-name {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 44px !important;
    padding: 9px 11px !important;
    border: 0 !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    font-size: .88rem !important;
  }

  .sc-ranking-table tbody td[data-mobile-label="Place"] {
    font-weight: 900;
  }

  .sc-ranking-table tbody tr.sc-place-1,
  .sc-ranking-table tbody tr.sc-place-2,
  .sc-ranking-table tbody tr.sc-place-3 {
    border-width: 1px;
  }

  .sc-ranking-table tbody tr.sc-place-1 {
    border-color: rgba(202, 154, 30, .42);
    box-shadow: 0 8px 22px rgba(202, 154, 30, .10);
  }

  .sc-ranking-table tbody tr.sc-place-2 {
    border-color: rgba(137, 151, 165, .34);
  }

  .sc-ranking-table tbody tr.sc-place-3 {
    border-color: rgba(183, 112, 64, .30);
  }

  .sc-ranking-table tbody tr.sc-place-1 td[data-mobile-label="Player"],
  .sc-ranking-table tbody tr.sc-place-1 td:nth-child(2) {
    background: linear-gradient(90deg, #fffaf0, #fff);
  }

  .sc-ranking-table tbody tr.sc-place-2 td[data-mobile-label="Player"],
  .sc-ranking-table tbody tr.sc-place-2 td:nth-child(2) {
    background: linear-gradient(90deg, #f6f8fa, #fff);
  }

  .sc-ranking-table tbody tr.sc-place-3 td[data-mobile-label="Player"],
  .sc-ranking-table tbody tr.sc-place-3 td:nth-child(2) {
    background: linear-gradient(90deg, #fff5ef, #fff);
  }

  /* Admin sections are still usable but visually secondary. */
  .sc-admin-import,
  .sc-admin-schedule {
    border-style: dashed;
    box-shadow: none;
  }

  .sc-import-controls {
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .sc-import-controls .sc-select-group,
  #scTournamentExcelInput,
  #scTournamentImportBtn,
  .sc-import-controls .sc-secondary-button {
    width: 100%;
    max-width: 100%;
  }

  .sc-admin-form {
    grid-template-columns: 1fr;
  }

  .sc-admin-form-wide {
    grid-column: 1;
  }

  .sc-admin-form-actions {
    width: 100%;
  }

  .sc-admin-form-actions > button {
    flex: 1 1 140px;
    max-width: 100%;
    min-height: 44px;
  }

  .sc-row-button {
    min-height: 38px;
    padding: 7px 11px;
    border-radius: 9px;
  }

  .sc-start-head span,
  .sc-section-head,
  .sc-meta,
  .sc-import-status {
    max-width: 100%;
    overflow-wrap: anywhere;
  }
}

@media (max-width: 390px) {
  .sc-page { padding: 0 7px; }
  .sc-toolbar { grid-template-columns: 82px minmax(0, 1fr); padding: 8px; }
  .sc-tab-button { font-size: .63rem; }
  .sc-card { padding: 14px 10px; border-radius: 18px; }
  .sc-winners-celebration { padding-left: 9px !important; padding-right: 9px !important; }
  .sc-winner-card { grid-template-columns: 47px minmax(0,1fr) !important; padding: 10px !important; }
  .sc-winner-trophy { width: 47px !important; height: 47px !important; font-size: 1.52rem !important; }
  .sc-start-head { align-items: flex-start; flex-direction: column; gap: 2px; }
  .sc-start-head span { text-align: left; }
}