/* Scoped presentation layer; scoring and operational state remain unchanged. */
:root {
  --ink: #202326;
  --muted: #6b7176;
  --line: #e1e4e6;
  --bg: #f5f6f6;
  --blue: #202326;
  --blue-dark: #202326;
  --soft-blue: #f0f2f3;
  --shadow: none;
}
[hidden] { display: none !important; }
button, input, select, summary { -webkit-tap-highlight-color: transparent; }
button:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible {
  outline: 2px solid #087a60;
  outline-offset: 3px;
}
input, select { border-radius: 6px; }
button { touch-action: manipulation; }
main { min-width: 0; }
body:not(.role-screen) .panel { border: 0; border-radius: 0; box-shadow: none; }
body:not(.role-screen) .panel + .panel { border-top: 1px solid var(--line); }
body:not(.role-screen) h1 { font-size: 25px; }
body:not(.role-screen) .sidebar { background: #fff; color: var(--ink); border-right: 1px solid var(--line); }
body:not(.role-screen) .brand span { color: var(--muted); }
body:not(.role-screen) .nav-button { background: transparent; color: var(--muted); border-radius: 6px; }
body:not(.role-screen) .nav-button.active { background: #edf1ef; color: #14624c; font-weight: 700; }
body:not(.role-screen) .season-card { background: #f5f6f6; color: var(--ink); border-color: var(--line); }
body:not(.role-screen) .season-card span, body:not(.role-screen) .season-card small { color: var(--muted); }
.store-tabs, .client-tabs { display: grid; gap: 0; border-bottom: 1px solid var(--line); background: #fff; }
.store-tabs { grid-template-columns: repeat(6, minmax(0, 1fr)); position: sticky; top: 0; z-index: 20; }
.client-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.store-tabs button, .client-tabs button {
  min-width: 0; min-height: 50px; padding: 12px 8px; border-radius: 0;
  background: transparent; color: var(--muted); border-bottom: 2px solid transparent;
  font-size: 15px; font-weight: 600; display: flex; justify-content: center; align-items: center; gap: 6px;
}
.store-tabs button[aria-current="page"], .client-tabs button[aria-current="page"] { border-color: var(--ink); color: var(--ink); }
.store-tabs button span:not(:empty) { font-size: 12px; color: #b42318; }
#clientRewardDot { width: 6px; height: 6px; border-radius: 50%; background: #bc3232; }
.disclosure { border-top: 1px solid var(--line); padding: 14px 0; }
.disclosure summary { cursor: pointer; font-size: 15px; font-weight: 600; min-height: 28px; color: var(--ink); }
.disclosure summary span { margin-left: 8px; color: var(--muted); font-size: 12px; }
.disclosure[open] > summary { margin-bottom: 14px; }
.disclosure p { line-height: 1.7; color: var(--muted); font-size: 13px; }
.tournament-form { padding: 6px 0 14px; }
.notice.show { padding: 12px 16px; border-left: 3px solid #087a60; background: #eef7f2; color: #204d3e; overflow-wrap: anywhere; }
.subscription-notice { margin: 0 0 16px; padding: 10px 14px; border-left: 3px solid #087a60; background: #eef7f2; color: #204d3e; font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
body.role-screen main { display: flex; flex-direction: column; }
body.role-screen .subscription-notice { flex: 0 0 auto; margin: 0; padding: 6px 18px; font-size: 12px; }
body.role-screen .screen-view { flex: 1; height: auto; min-height: 0; }
#storeActionNotice { grid-column: 1 / -1; }
#store .split .panel { border: 0; }
#store { gap: 0; background: #fff; }
#store .panel { margin: 0; }
#store .panel-title p { max-width: 720px; }
#store .referral-settings-form { display: flex; gap: 20px; flex-wrap: wrap; align-items: end; }
#store .referral-settings-form label { min-width: 120px; }
#store .referral-settings-form label:has(input[type="checkbox"]) { display: flex; align-items: center; gap: 8px; align-self: center; }
#store input[type="checkbox"] { width: 18px; height: 18px; min-height: 18px; accent-color: #202326; }
.honor-badge { display: inline-block; color: #7c590e; background: #faf4e5; font-size: 12px; font-weight: 600; padding: 4px 7px; border-radius: 4px; line-height: 1.4; overflow-wrap: anywhere; }
.honor-history-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.honor-history-row strong, .honor-history-row small { display: block; }
.honor-history-row strong { font-size: 14px; }
.honor-history-row small { font-size: 12px; color: var(--muted); margin-top: 5px; }
.honor-history-row input { accent-color: #202326; }
.screen-player .honor-badge { margin-top: 5px; background: #f7d98a; color: #332913; font-size: 15px; }
.screen-champions { display: flex; flex-wrap: wrap; gap: 10px; }
.screen-champions:empty { display: none; }
.screen-champions > div { padding: 8px 12px; border-left: 3px solid #e3c67b; }
.screen-champions strong { font-size: 18px; color: #fff; }
.screen-champions span { display: block; font-size: 13px; color: #e3c67b; margin-bottom: 4px; }
body.role-screen .screen-view { display: flex; flex-direction: column; gap: 12px; padding: 16px 18px 24px; background: #171a1b; }
body.role-screen .screen-hero { flex: 0 0 auto; min-height: 0; padding: 12px 18px; border: 0; border-radius: 0; background: #242a2b; }
body.role-screen .screen-brand img { width: 84px; height: 56px; object-fit: contain; }
body.role-screen .screen-brand h2 { font-size: 26px; }
body.role-screen .screen-brand .eyebrow { display: none; }
body.role-screen .screen-hero span { font-size: 13px; }
body.role-screen .screen-grid, body.role-screen .screen-tournament-layout { flex: 1; height: auto; min-height: 0; margin-top: 0; }
body.role-screen .screen-grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 14px; }
body.role-screen .screen-panel { padding: 12px; border: 0; border-radius: 0; min-height: 0; background: #242a2b; }
body.role-screen .ranking-panel { display: flex; flex-direction: column; }
body.role-screen .screen-panel-title { margin-bottom: 8px; flex: 0 0 auto; }
body.role-screen .screen-panel-title h2 { font-size: 20px; }
body.role-screen .screen-ranking { flex: 1; min-height: 0; grid-template-rows: repeat(10, minmax(0, 1fr)); gap: 4px; }
body.role-screen .screen-rank-row { min-height: 0; grid-template-columns: 38px minmax(0, 1fr) 60px 76px; padding: 3px 8px; gap: 9px; border-radius: 4px; overflow: hidden; }
body.role-screen .rank-num { width: 30px; height: 30px; font-size: 17px; background: transparent; }
body.role-screen .screen-rank-row.top { background: #39382e; border-color: #72694e; }
body.role-screen .screen-player { min-width: 0; }
body.role-screen .screen-player strong { font-size: 18px; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.role-screen .screen-player .honor-badge { font-size: 11px; line-height: 1.25; margin-top: 2px; padding: 2px 4px; }
body.role-screen .screen-player .honor-badge + span { display: none; }
body.role-screen .screen-player > span { max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.role-screen .screen-score strong { font-size: 22px; line-height: 1.2; }
body.role-screen .screen-division { line-height: 1.2; white-space: nowrap; }
body.role-screen .screen-score span { display: none; }
body.role-screen .screen-champions { flex: 0 0 auto; margin-bottom: 6px; }
body.role-screen .screen-champions > div { padding: 3px 9px; }
body.role-screen .screen-champions span { display: inline; margin-right: 10px; }
body.role-screen .screen-champions strong { font-size: 17px; }
body.role-screen .screen-side { min-height: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 12px; }
body.role-screen .screen-side .screen-panel { overflow: hidden; }
body.role-screen .screen-side .screen-panel-title { flex-wrap: wrap; gap: 4px; }
body.role-screen .screen-side .screen-panel-title span { font-size: 12px; }
body.role-screen .screen-match-card, body.role-screen .screen-reward-card, body.role-screen .screen-winner-card, body.role-screen .screen-challenge-card { padding: 10px; border: 0; border-radius: 4px; }
body.role-screen .screen-side strong, body.role-screen .screen-side span { overflow-wrap: anywhere; }
/* TV boxes often expose a 540px viewport even on a full-size television. */
@media (max-height: 740px) {
  body.role-screen .screen-player { display: flex; align-items: center; gap: 6px; overflow: hidden; }
  body.role-screen .screen-player strong { flex: 1 1 auto; min-width: 0; font-size: 16px; line-height: 20px; }
  body.role-screen .screen-player > span:not(.honor-badge) { display: none; }
  body.role-screen .screen-player .honor-badge { flex: 0 1 auto; max-width: 55%; min-width: 0; margin: 0; padding: 1px 3px; line-height: 16px; }
  body.role-screen .rank-num { width: 24px; height: 20px; font-size: 15px; line-height: 20px; }
  body.role-screen .screen-score strong { font-size: 19px; line-height: 22px; }
  body.role-screen .screen-division { font-size: 14px; line-height: 20px; }
}
@media (max-height: 580px) {
  body.role-screen .screen-view { padding: 8px 12px 20px; gap: 8px; }
  body.role-screen .screen-hero { padding: 8px 12px; }
  body.role-screen .screen-brand img { width: 64px; height: 42px; }
  body.role-screen .screen-brand h2 { font-size: 22px; margin: 0 0 3px; }
  body.role-screen .screen-hero span { font-size: 12px; }
  body.role-screen .screen-clock { font-size: 30px; }
  body.role-screen .screen-panel { padding: 8px; }
  body.role-screen .screen-panel-title { margin-bottom: 5px; }
  body.role-screen .screen-panel-title h2 { font-size: 18px; }
  body.role-screen .screen-ranking { gap: 3px; }
  body.role-screen .screen-rank-row { padding: 1px 6px; grid-template-columns: 26px minmax(0, 1fr) 42px 58px; gap: 6px; }
  body.role-screen .screen-champions { gap: 5px; margin-bottom: 4px; }
  body.role-screen .screen-champions > div { padding: 1px 6px; }
  body.role-screen .screen-champions strong { font-size: 14px; }
  body.role-screen .screen-champions span { font-size: 12px; }
}
body.role-client, body.role-referee { background: #f5f6f6; }
body.role-client main, body.role-referee main { padding: 0 16px; background: #fff; }
body.role-client .view.active, body.role-referee .view.active { gap: 0; }
body.role-client .mobile-hero, body.role-referee .mobile-hero {
  border: 0; border-radius: 0; padding: 22px 0 16px; grid-template-columns: 60px minmax(0, 1fr); gap: 12px;
}
body.role-client .mobile-hero img, body.role-referee .mobile-hero img { width: 60px; height: 48px; border-radius: 0; }
body.role-client .mobile-hero h2, body.role-referee .mobile-hero h2 { font-size: 19px; }
body.role-client .mobile-hero .eyebrow, body.role-referee .mobile-hero .eyebrow { display: none; }
body.role-client .mobile-hero span, body.role-referee .mobile-hero span { font-size: 11px; font-weight: 400; line-height: 1.5; }
body.role-client .panel, body.role-referee .panel { padding: 20px 0; margin: 0; background: #fff; }
body.role-client .client-player-card { padding: 0; background: transparent; border: 0; box-shadow: none; }
body.role-client .client-player-main { align-items: start; }
body.role-client .client-player-main strong { font-size: 24px; color: var(--ink); overflow-wrap: anywhere; }
body.role-client .client-player-main span { color: var(--muted); }
body.role-client .client-player-main .honor-badge { margin-top: 7px; color: #7c590e; }
body.role-client .client-player-stats { display: none; }
body.role-client .client-score strong { font-size: 30px; font-variant-numeric: tabular-nums; }
body.role-client .client-status { border: 0; border-radius: 4px; background: #f4f5f5; color: #555e63; font-size: 13px; line-height: 1.65; padding: 12px; }
body.role-client .client-status.ready { background: #eef7f2; color: #14624c; }
body.role-client .client-status.waiting { background: #f8f4e9; color: #7c590e; }
body.role-client .client-match-tools { grid-template-columns: minmax(0, 1fr); gap: 12px; }
body.role-client #joinQueue, body.role-client .challenge-primary-action { min-height: 52px; font-size: 17px; }
body.role-client #challengeOpenDetails { border-top: 0; padding-top: 0; }
body.role-client #challengeOpenDetails > summary {
  display: flex; align-items: center; justify-content: center; width: 100%;
  padding: 13px 16px; border-radius: 8px; color: #fff; background: var(--blue);
  list-style: none; text-align: center; line-height: 1.5;
}
body.role-client #challengeOpenDetails > summary::-webkit-details-marker { display: none; }
body.role-client .challenge-open-form { grid-template-columns: minmax(0, 1fr); gap: 14px; }
body.role-client .challenge-open-form > * { min-width: 0; }
body.role-client .challenge-primary-action { width: 100%; white-space: normal; line-height: 1.5; }
body.role-client .challenge-fee-note { margin: 0; padding: 12px; border-radius: 6px; background: #eef7f2; color: #245342; line-height: 1.7; }
body.role-client .challenge-fee-note strong { display: block; font-size: 15px; }
body.role-client .challenge-actions { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; margin-top: 14px; }
body.role-client .challenge-actions > button { width: 100%; min-height: 48px; white-space: normal; }
body.role-client .challenge-actions > .challenge-primary-action { min-height: 52px; }
body.role-client .challenge-item .challenge-cost { display: block; margin-top: 8px; font-size: 14px; font-weight: 600; color: #14624c; }
body.role-client .continuous-toggle { display: flex; justify-content: center; align-items: center; gap: 9px; font-size: 13px; font-weight: 400; margin: 0; }
body.role-client input[type="checkbox"], body.role-client input[type="radio"] { min-height: 18px; width: 18px; height: 18px; accent-color: #202326; }
body.role-client:not(.client-bound) .client-match-tools,
body.role-client:not(.client-bound) #clientPlayerCard,
body.role-client:not(.client-bound) #challengeOpenDetails { display: none; }
body.role-client .client-pool-overview { margin-top: 12px; border: 0; border-radius: 0; padding: 8px 0; background: transparent; }
body.role-client .challenge-item { border-radius: 6px; background: #f7f8f7; border: 1px solid #e4e8e5; padding: 14px; }
body.role-client .challenge-item strong { font-size: 15px; line-height: 1.5; overflow-wrap: anywhere; }
body.role-client .challenge-item span { font-size: 12px; line-height: 1.7; }
body.role-client .challenge-item .compact-buttons { display: grid; grid-template-columns: 1fr 1fr; }
body.role-client .client-main-list .panel:nth-child(2) { display: block; }
body.role-client .wallet-entry { border: 0; border-radius: 0; background: #f5f6f6; color: var(--ink); margin-top: 20px; padding: 14px; }
body.role-client .wallet-entry strong { color: #14624c; }
.account-actions { display: flex; gap: 12px; margin-top: 16px; }
#clientAccountSummary > strong { display: block; font-size: 24px; overflow-wrap: anywhere; }
#clientAccountSummary > span { display: block; color: var(--muted); font-size: 13px; margin-top: 7px; }
#clientInviteLinkBox { margin-top: 12px; }
#clientInviteFeedback { display: block; margin-top: 10px; color: #14624c; font-size: 13px; }
.invite-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.invite-card-box { margin: 16px auto; max-width: 360px; text-align: center; }
.invite-card-box img { display: block; width: 100%; height: auto; border-radius: 12px; }
.invite-card-box a { display: inline-block; padding: 10px 20px; color: #075440; text-decoration: underline; }
.invite-accepted:not(:empty) { padding: 12px; background: #eaf5ef; border-radius: 8px; }
.invite-record { display: grid; grid-template-columns: 1fr auto; gap: 5px 12px; padding: 12px 0; border-top: 1px solid #e3e8e5; }
.invite-record small { grid-column: 1 / -1; color: #737873; }
body.role-screen .screen-match-panel { display: flex; flex-direction: column; }
body.role-screen .screen-client-join { min-height: 0; flex: 1; display: flex; align-items: center; justify-content: center; gap: 10px; flex-direction: column; text-align: center; }
body.role-screen .screen-client-join img { width: min(100%, 22vh, 240px); height: min(22vh, 240px); object-fit: contain; flex: 0 1 auto; min-height: 60px; }
body.role-screen .screen-client-join strong { display: block; font-size: clamp(13px, 1.15vw, 22px); color: #f6d99b; }
body.role-screen .screen-client-join span { display: block; font-size: 13px; margin-top: 4px; }
body.role-screen .screen-client-join small { display: none; }
body.role-screen .screen-client-small { display: flex; align-items: center; margin-left: auto; }
body.role-screen .screen-match-panel .screen-panel-title { flex-wrap: nowrap; }
body.role-screen .screen-match-panel #screenMatches { flex: 1; min-height: 0; overflow: hidden; }
body.role-screen .screen-match-panel .screen-match-card { padding: 6px 8px; }
body.role-screen .screen-match-panel .screen-match-card strong { font-size: 16px; line-height: 1.25; }
body.role-screen .screen-match-panel .screen-match-card span { margin-top: 3px; }
body.role-screen .screen-client-small img { width: clamp(60px, 9vh, 100px); height: clamp(60px, 9vh, 100px); }
body.role-screen .screen-client-small span { font-size: 13px; color: #f6d99b; }
body.role-screen .screen-client-join[hidden], body.role-screen .screen-client-small[hidden], body.role-screen #screenMatches[hidden], .invite-card-box[hidden] { display: none; }
@media (max-height: 650px) {
  body.role-screen .screen-client-join { flex-direction: row; gap: 8px; }
  body.role-screen .screen-client-join img { width: min(20vh, 140px); height: min(20vh, 140px); }
  body.role-screen .screen-client-small img { width: 48px; height: 48px; }
  body.role-screen .screen-match-panel .screen-panel-title > span { display: none; }
  body.role-screen .screen-match-panel .screen-match-card strong { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  body.role-screen .screen-match-panel .screen-match-card span { font-size: 11px; line-height: 1.2; }
}
body.role-client .reward-card { min-width: 0; min-height: 0; background: #f7f8f8; padding: 14px; border-radius: 6px; }
body.role-client .reward-showcase { display: grid; grid-template-columns: minmax(0, 1fr); overflow: visible; }
body.role-client .client-shop-sheet { border-radius: 8px 8px 0 0; }
body.role-client .client-shop-sheet .shop-product-grid { grid-template-columns: minmax(0, 1fr); }
body.role-client .shop-product { border-radius: 6px; }
body.role-client #rankingBody td { overflow-wrap: anywhere; }
body.role-client .signup-list { max-height: 280px; overflow-y: auto; }
@media (max-width: 760px) {
  body.role-store .brand, body.role-members .brand { grid-template-columns: 64px minmax(0, 1fr); }
  body.role-store .brand img, body.role-members .brand img { width: 64px; height: 40px; }
  body.role-store .topbar, body.role-members .topbar { gap: 12px; }
  .store-tabs button { font-size: 14px; padding: 10px 4px; }
  .dashboard-grid { gap: 1px; background: var(--line); border: 1px solid var(--line); }
  .metric { border: 0; border-radius: 0; padding: 12px; }
  body.role-store .panel { padding: 18px 10px; }
  .account-actions button { padding: 0 8px; }
}

/* Make both winner choices look equally actionable in every adjudication view. */
body .adjudication-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  width: 100%;
  margin: 14px 0;
}
body .adjudication-choice {
  display: flex;
  flex-direction: column-reverse;
  justify-content: center;
  align-items: center;
  gap: 7px;
  min-width: 0;
  min-height: 80px;
  padding: 14px 12px;
  border: 2px solid #0f604a;
  border-radius: 10px;
  background: #146c53;
  color: #fff;
  box-shadow: 0 3px 0 #0b4939;
  cursor: pointer;
  white-space: normal;
  text-align: center;
}
body .adjudication-choice strong {
  margin: 0;
  color: #fff;
  font-size: 20px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
body .adjudication-choice span {
  margin: 0;
  color: #e5f8ef;
  font-size: 13px;
  line-height: 1.4;
}
body .adjudication-choice:hover:not(:disabled) { background: #105a46; border-color: #0b4939; }
body .adjudication-choice:active:not(:disabled) { transform: translateY(2px); box-shadow: 0 1px 0 #0b4939; }
body .adjudication-choice:focus-visible { outline: 3px solid #da9f24; outline-offset: 3px; }
body .adjudication-choice:disabled { opacity: .55; cursor: not-allowed; box-shadow: none; }
.store-match-card > .adjudication-choice-grid { grid-column: 1 / -1; }

/* Yiganming: shared with the native player app (warm paper, jade, forest, gold). */
body:not(.role-screen) {
  --ink: #243b31; --muted: #66786c; --line: #dfe4d8; --bg: #f6f4ee;
  --blue: #195a45; --blue-dark: #174d3b; --soft-blue: #e9eee7;
  --panel: #fffefa; --gold: #97763e; --soft-gold: #f4eddd;
  background: var(--bg); color: var(--ink);
}
body:not(.role-screen) :is(.primary, .secondary, .ghost, .danger-button) { border-radius: 10px; min-height: 44px; }
body:not(.role-screen) .primary { background: #195a45; color: #fffefa; }
body:not(.role-screen) .secondary { background: #e9eee7; color: #245842; border: 1px solid #cfdbce; }
body:not(.role-screen) .ghost { background: #fffefa; border: 1px solid #d9e1d5; color: #4b6858; }
body:not(.role-screen) .primary:hover:not(:disabled) { background: #124632; }
body:not(.role-screen) :is(input,select,textarea) { border-radius: 9px; border-color: #d4ddcf; background: #fbfcf7; }
body:not(.role-screen) :is(input,select,textarea):focus { border-color: #398464; }
body:not(.role-screen) :is(h1,h2,h3) { letter-spacing: -.02em; }
body:is(.role-store,.role-members) .sidebar { background: #173d32; color: #fffefa; border: 0; }
body:is(.role-store,.role-members) .brand span { color: #b7cdbd; }
body:is(.role-store,.role-members) .brand img { border-radius: 10px; background: #fffefa; }
body:is(.role-store,.role-members) .nav-button { color: #c4d4c7; min-height: 48px; border-radius: 10px; }
body:is(.role-store,.role-members) .nav-button.active { background: #e3cf9e; color: #284932; }
body:is(.role-store,.role-members) .nav-button:hover:not(.active) { background: #244f40; }
body:is(.role-store,.role-members) .season-card { border: 1px solid #3e6050; border-radius: 14px; background: #214737; color: #fffefa; padding: 18px; }
body:is(.role-store,.role-members) .season-card :is(span,small) { color: #c0d2bd; }
body:is(.role-store,.role-members) main { padding: 26px; }
body:is(.role-store,.role-members) .topbar { align-items: center; margin-bottom: 22px; }
body:is(.role-store,.role-members) .topbar h1 { font-size: 28px; }
body:is(.role-store,.role-members) .topbar .eyebrow { color: #557665; margin-bottom: 8px; }
.subscription-notice { background: #ecf0e5; border-color: #829c75; color: #4b6452; border-radius: 0 8px 8px 0; font-size: 12px; }
body:is(.role-store,.role-members) .dashboard-grid { gap: 12px; background: transparent; border: 0; margin-bottom: 24px; }
body:is(.role-store,.role-members) .metric { border: 1px solid #e2e5d9; border-radius: 14px; background: #fffefa; padding: 20px; box-shadow: 0 3px 12px #203d2b04; }
body:is(.role-store,.role-members) .metric strong { color: #195a45; font-variant-numeric: tabular-nums; font-size: 32px; }
body:is(.role-store,.role-members) .metric:nth-child(3) { border-color: #e2d3b4; background: #fbf6e9; }
body:is(.role-store,.role-members) .metric:nth-child(3) strong { color: #876831; }
#store { background: transparent; gap: 16px; }
body.role-store .store-tabs {
  display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 8px;
  background: #f6f4ee; border: 0; padding: 10px 0; top: 0;
}
body.role-store .store-tabs button {
  min-height: 52px; padding: 10px 8px; border: 1px solid #cbd9c9; border-radius: 10px;
  background: #edf1e8; color: #396449; font-size: 15px; font-weight: 650; white-space: nowrap;
  transition: background-color .15s, border-color .15s;
}
body.role-store .store-tabs button:hover { background: #dde8d9; border-color: #8ca98a; }
body.role-store .store-tabs button[aria-current="page"] { background: #195a45; color: #fffefa; border-color: #195a45; box-shadow: 0 3px 0 #b99d60; }
body.role-store .store-tabs button span:not(:empty) { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 12px; background: #f4e8cf; color: #825925; font-size: 11px; }
body.role-store .store-tabs button[aria-current="page"] span:not(:empty) { background: #e3cf9e; color: #284932; }
body:is(.role-store,.role-members) :is(.panel,#store .panel) { padding: 24px; border: 1px solid #e2e5d9; border-radius: 14px; background: #fffefa; box-shadow: 0 3px 12px #203d2b03; }
body.role-store .panel + .panel { border-top: 1px solid #e2e5d9; }
body.role-store #store .split .panel { border: 1px solid #e2e5d9; }
body.role-store .panel-title { align-items: center; gap: 12px; }
body.role-store .panel-title h2 { font-size: 20px; }
body.role-store .panel-title p { color: #6e7a70; line-height: 1.75; }
body.role-store :is(.broadcast-item,.queue-item,.referee-item,.adjudication-card,.dispute-item) { border: 1px solid #e1e7da; border-radius: 10px; padding: 16px; background: #f8faf3; }
body.role-store .referee-item.approved { background: #f0f6ea; border-color: #cbdac1; }
body.role-store .referee-item.pending { background: #fbf4e3; border-color: #e5d4ac; }
body.role-store :is(.store-match-card,.tournament-card,.reward-setting-section,.reward-preset-card) { border-radius: 12px; }
body.role-store .referee-list { gap: 12px; }
body.role-store #storeAdjudication { display: grid; gap: 12px; margin-top: 18px; }
body.role-store .adjudication-choice-grid { margin-bottom: 4px; }
body:not(.role-screen) .adjudication-choice { background: #195a45; border-color: #195a45; box-shadow: 0 3px 0 #b99d60; }
body:not(.role-screen) table th { background: #edf1e8; color: #45614d; }
body:not(.role-screen) table td { border-color: #e6e9df; }
body:not(.role-screen) .table-wrap { border-radius: 10px; border-color: #e2e5d9; }
body:not(.role-screen) .pill { background: #edf1e8; color: #396449; border-radius: 8px; }
body:not(.role-screen) .pill.danger { background: #f8e9df; color: #a54e33; }
.store-auth-gate { background: #f6f4ee; }
.store-login-panel { border-radius: 20px; border-color: #dce4d6; background: #fffefa; border-top: 5px solid #195a45; box-shadow: 0 18px 55px #173d3210; }
body:is(.role-client,.role-referee) main { background: #f6f4ee; padding: 16px; }
body:is(.role-client,.role-referee) .view.active { gap: 16px; }
body:is(.role-client,.role-referee) .mobile-hero { padding: 24px 20px; border-radius: 16px; background: #174d3b; color: #fffefa; }
body:is(.role-client,.role-referee) .mobile-hero img { background: #fffefa; border-radius: 12px; padding: 3px; }
body:is(.role-client,.role-referee) .mobile-hero span { color: #c0d2bd; }
body:is(.role-client,.role-referee) .panel { padding: 20px 16px; border: 1px solid #e6e6dc; border-radius: 14px; background: #fffefa; }
body.role-client .client-tabs { padding: 6px; gap: 6px; border: 1px solid #dce4d6; border-radius: 12px; background: #edf1e8; }
body.role-client .client-tabs button { border: 0; border-radius: 8px; color: #396449; }
body.role-client .client-tabs button[aria-current="page"] { background: #195a45; color: #fffefa; }
body.role-client :is(.wallet-entry,.client-status) { border-radius: 10px; }
body.role-client .client-score strong { color: #97763e; }
@media(min-width: 761px) {
  body:is(.role-store,.role-members) .app-shell { grid-template-columns: 236px minmax(0,1fr); }
  body:is(.role-store,.role-members) .sidebar { position: sticky; top: 0; height: 100vh; align-self: start; }
  body:is(.role-store,.role-members) .brand { grid-template-columns: 60px minmax(0,1fr); gap: 10px; }
  body:is(.role-store,.role-members) .brand img { width: 60px; height: 52px; }
  body:is(.role-store,.role-members) .brand strong { font-size: 16px; }
}
@media(max-width: 760px) {
  body:is(.role-store,.role-members) main { padding: 14px 12px; }
  body:is(.role-store,.role-members) .topbar { align-items: stretch; margin-bottom: 18px; }
  body:is(.role-store,.role-members) .topbar h1 { font-size: 24px; }
  body:is(.role-store,.role-members) .top-actions { display: flex; gap: 8px; flex-wrap: wrap; }
  body:is(.role-store,.role-members) .top-actions button { font-size: 13px; padding: 0 12px; }
  body:is(.role-store,.role-members) .metric { padding: 14px 16px; }
  body.role-store .store-tabs { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
  body.role-store .store-tabs button { min-height: 44px; font-size: 14px; }
  body:is(.role-store,.role-members) :is(.panel,#store .panel) { padding: 18px 14px; }
  body.role-store .panel-title { flex-wrap: wrap; }
  body.role-store .store-match-list { grid-template-columns: minmax(0,1fr); }
  body:not(.role-screen) .adjudication-choice { padding: 12px 8px; }
  body:not(.role-screen) .adjudication-choice strong { font-size: 17px; }
}
@media(prefers-reduced-motion:reduce) { body.role-store .store-tabs button { transition: none; } }

.quick-entry{display:flex;flex-wrap:wrap;align-items:center;gap:12px}.quick-entry p{flex-basis:100%;margin:0}.entry-dialog{max-width:min(440px,calc(100vw - 32px));border:1px solid #dce4d9;border-radius:20px;padding:24px;background:#fffefa;color:#243b31}.entry-dialog::backdrop{background:#102b2466}.entry-dialog img{display:block;max-width:100%;height:auto;margin:18px auto}.entry-dialog img[hidden]{display:none}.entry-dialog input{width:100%;box-sizing:border-box}.entry-dialog p{line-height:1.7}.entry-dialog .quick-entry{margin-top:20px}
body.role-referee dialog.entry-dialog,body.role-client dialog.entry-dialog,dialog.entry-dialog{box-sizing:border-box;width:min(440px,calc(100vw - 32px));max-width:min(440px,calc(100vw - 32px))}body.role-client .mobile-hero h2,body.role-referee .mobile-hero h2{color:#fffefa}body.role-client .mobile-hero span,body.role-referee .mobile-hero span{color:#d2e1cf}

.qr-export-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.qr-export-actions button{min-height:40px}#arenaLimitButton{white-space:nowrap}#qrExportStatus:not(:empty){padding:12px;border-radius:10px;background:#eaf4ed;color:#174f3e}
.deploy-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.deploy-card{min-width:0}.deploy-card a,.deploy-card span{overflow-wrap:anywhere}.deploy-card button,.deploy-card a{max-width:100%}
@media(max-width:720px){.deploy-grid{grid-template-columns:1fr}.deploy-card img{width:min(100%,240px);height:auto}.qr-export-actions{width:100%}.qr-export-actions button{flex:1;min-width:120px}}

.qr-download-dialog{width:min(540px,90vw);max-height:90vh;overflow:auto;border:0;border-radius:18px;padding:24px;background:#fff;color:#18392e}.qr-download-dialog::backdrop{background:#15251cc0}.qr-download-dialog img{display:block;width:min(100%,380px);height:auto;margin:12px auto 20px}.qr-download-dialog a{display:inline-block;padding:12px 24px;border-radius:10px;background:#165441;color:#fff;text-decoration:none;margin-right:12px}.qr-download-dialog p{line-height:1.6;color:#596b62}

#rewardSaveStatus55:not(:empty){padding:14px 16px;border-radius:10px;background:#fff3d6;color:#684915;border:1px solid #e6cd90;line-height:1.7;overflow-wrap:anywhere}#rewardSaveStatus55[data-kind="success"]{background:#e8f4eb;color:#195b37;border-color:#a7d2b6}#rewardSaveStatus55[data-kind="error"]{background:#fff0eb;color:#973c20;border-color:#e3b09f}#rewardSettingsPanel55 .reward-setting-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}#rewardSettingsPanel55[aria-busy="true"]{cursor:progress}
/* Rollover confirmation stays in view on desktop and merchant phones. */
#seasonDialog56{box-sizing:border-box;width:min(620px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:0;margin:auto;border:1px solid #b6c8c2;border-radius:16px;background:#fff;color:#163c32;box-shadow:0 14px 60px #0005;overflow:auto}
#seasonDialog56::backdrop{background:rgba(8,27,23,.65)}
#seasonDialog56 .season-dialog-inner56{padding:24px}
#seasonDialog56 h2{margin:0 0 16px;font-size:23px;color:#123a30}
#seasonDialog56 p{line-height:1.65;white-space:pre-wrap;color:#37594f}
#seasonDialog56 fieldset{border:0;padding:0;margin:0;min-width:0}
#seasonDialog56 label{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;font-size:14px;color:#244c40}
#seasonDialog56 input:not([type=checkbox]){box-sizing:border-box;min-width:0;width:100%;height:44px;border:1px solid #91aaa1;border-radius:8px;padding:8px;background:white;color:#173e32;font:inherit}
#seasonDialog56 .season-dates56{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#seasonDialog56 .season-ack56{flex-direction:row;align-items:flex-start;line-height:1.6;background:#fff3dc;padding:12px;border-radius:8px;color:#704214}
#seasonDialog56 .season-ack56 input{flex:0 0 20px;width:20px;height:20px;margin:3px 3px 0 0;accent-color:#176347}
#seasonDialog56 .season-actions56{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin-top:16px}
#seasonDialog56 button{min-height:44px;white-space:normal}
#seasonDialog56 button:disabled{opacity:.55;cursor:not-allowed}
#seasonMessage56,#seasonActionStatus56:not(:empty){padding:12px;border:1px solid #b8cfc4;border-radius:8px;background:#f1f7f3;line-height:1.65}
#seasonDialog56 #seasonMessage56[data-kind=error],#seasonActionStatus56[data-kind=error]{color:#9a2929;background:#fff0ee;border-color:#e8b3ad}
#seasonDialog56 #seasonMessage56[data-kind=success],#seasonActionStatus56[data-kind=success]{color:#145733;background:#e8f7ee;border-color:#a5cfb4}
@media(max-width:520px){#seasonDialog56 .season-dialog-inner56{padding:16px}#seasonDialog56 h2{font-size:20px}#seasonDialog56 .season-actions56 button{flex:1 1 45%}}