.member-reference-records, .member-record-detail, .member-reference-results {
  --record-bg: #161616;
  --record-row: #202223;
  --record-head: #252b2d;
  --record-line: #26444c;
  --record-text: #edf2f3;
  --record-muted: #b7c7cc;
  --record-accent: #83dcf0;
  min-width: 0;
  color: var(--record-text);
  font-family: Gulim, Dotum, Arial, "Noto Sans KR", sans-serif;
  font-size: 12px;
  letter-spacing: 0;
}
.member-reference-records { padding-block: 8px 20px; background: var(--record-bg); }
.member-app-shell:is([data-view="orders"], [data-view="resultHistory"]) .member-body { grid-template-columns: minmax(0, 1fr); }
.member-app-shell:is([data-view="orders"], [data-view="resultHistory"]) .member-side-nav { display: none; }
.reference-record-products { display: flex; flex-wrap: wrap; gap: 1px; padding-bottom: 18px; border-bottom: 1px solid var(--record-line); }
.reference-record-command { min-height: 28px; min-width: 64px; padding: 4px 10px; border: 1px solid #4a626b; border-radius: 2px; background: #282e31; color: #edf2f3; font: inherit; font-size: 13px; line-height: 1.4; letter-spacing: 0; white-space: nowrap; cursor: pointer; }
.reference-record-command:hover:not(:disabled) { background: #36464d; color: #fff; }
.reference-record-command.is-selected { border-color: #2e768b; background: #1e5364; color: #fff; }
.reference-record-command:focus-visible, .reference-record-scroll:focus-visible, .reference-record-field :is(input, select):focus-visible { outline: 2px solid #83dcf0; outline-offset: 2px; }
.reference-record-command:disabled { opacity: .48; cursor: default; }
.reference-record-layout { display: grid; grid-template-columns: minmax(180px, 260px) minmax(0, 760px); justify-content: center; align-items: start; gap: 18px; padding-top: 18px; }
.member-reference-records:not(.product-racing) .reference-record-layout { display: block; padding-inline: 0; }
.reference-record-main { min-width: 0; }
.reference-record-categories { display: grid; border-block: 1px solid #345d6b; }
.reference-record-categories .reference-record-command { width: 100%; min-height: 54px; padding-inline: 16px; border: 0; border-bottom: 1px solid #345d6b; border-radius: 0; text-align: left; white-space: normal; overflow-wrap: anywhere; background: #1d282d; color: #83dcf0; }
.reference-record-categories .reference-record-command.is-selected { background: #1e5364; color: #fff; }
.reference-record-sorts { min-height: 36px; display: flex; flex-wrap: wrap; align-items: center; gap: 2px; padding: 4px 2px; background: #203e48; }
.reference-record-sorts .reference-record-command { min-width: 78px; min-height: 28px; padding: 3px 8px; }
.reference-record-totals { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; min-height: 30px; padding: 7px 8px; font-size: 12px; font-variant-numeric: tabular-nums; }
.reference-record-scroll { min-width: 0; max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; border-block: 1px solid var(--record-line); scrollbar-gutter: stable; }
.reference-record-table { width: 100%; min-width: 760px; table-layout: auto; border-collapse: collapse; background: var(--record-bg); color: var(--record-text); }
.reference-record-table :is(th, td) { height: 38px; padding: 6px 5px; border: 0; border-bottom: 1px solid var(--record-line); text-align: center; font-size: 12px; font-weight: 400; line-height: 1.5; letter-spacing: 0; white-space: nowrap; }
.reference-record-table th { height: 38px; background: var(--record-head); color: var(--record-accent); font-weight: 700; }
.reference-record-table tbody tr:nth-child(even) { background: var(--record-row); }
.reference-record-table tbody tr:hover { background: #253239; }
.reference-record-table td.number { text-align: right; font-variant-numeric: tabular-nums; }
.reference-record-table .column-venue { max-width: 140px; overflow: hidden; text-overflow: ellipsis; }
.reference-record-table .column-game { max-width: 240px; white-space: normal; overflow-wrap: anywhere; }
.reference-record-table .reference-record-empty { height: 38px; color: var(--record-muted); text-align: center; }
.reference-record-table .is-cancelled { color: #c1cdd1; }
.reference-record-status { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 4px; }
.reference-record-status.is-cancelled > span { color: #b8e0df; }
.reference-record-icon { width: 28px; min-width: 28px; height: 28px; padding: 5px; display: inline-grid; place-items: center; }
.reference-record-icon :is(i, svg) { width: 16px; height: 16px; }
.reference-record-cancel { min-height: 26px; min-width: 42px; padding: 2px 6px; border-color: #95605b; background: #533330; color: #fff; }
.reference-record-pagination { min-height: 44px; display: flex; justify-content: center; align-items: center; gap: 12px; font-size: 12px; }
.reference-record-search { margin-top: 14px; border-block: 1px solid var(--record-line); }
.reference-record-search > summary { padding: 10px 8px; color: var(--record-accent); cursor: pointer; }
.reference-record-search form { padding: 10px 8px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.reference-record-field { min-width: 0; display: grid; gap: 5px; font-size: 12px; }
.reference-record-field :is(input, select) { min-width: 0; width: 100%; height: 34px; padding: 5px 7px; border: 1px solid #526970; border-radius: 2px; background: #1b252a; color: #edf2f3; font: inherit; }
.reference-record-search-actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 8px; }
.reference-record-check { display: flex; align-items: center; gap: 6px; margin-right: auto; }
.reference-record-check input { width: 16px; height: 16px; }
.reference-record-error, .reference-record-loading { padding: 10px 8px; font-size: 13px; line-height: 1.5; }
.reference-record-error { border-block: 1px solid #a05e58; color: #ffcec7; }
.reference-record-error .reference-record-command { margin-left: 10px; }
.member-record-detail { width: min(1100px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); padding: 0; display: flex; flex-direction: column; overflow: hidden; border: 1px solid #4c7580; border-radius: 3px; background: var(--record-bg); }
.member-record-detail .modal-head { flex: 0 0 auto; min-height: 46px; padding: 8px 12px; background: #203e48; border-bottom: 1px solid var(--record-line); }
.member-record-detail .modal-head h2 { margin: 0; color: #edf2f3; font-size: 16px; }
.member-record-detail .modal-body { min-height: 0; padding: 12px; overflow-y: auto; }
.member-record-detail .modal-actions { flex: 0 0 auto; display: flex; justify-content: flex-end; gap: 8px; padding: 8px 12px; border-top: 1px solid var(--record-line); background: #202b2f; }
.reference-record-detail-facts { margin: 0 0 12px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--record-line); }
.reference-record-detail-facts > div { min-width: 0; display: grid; grid-template-columns: 120px minmax(0, 1fr); border-bottom: 1px solid var(--record-line); }
.reference-record-detail-facts dt, .reference-record-detail-facts dd { margin: 0; padding: 9px 8px; overflow-wrap: anywhere; }
.reference-record-detail-facts dt { color: var(--record-accent); background: var(--record-head); }
.member-reference-results { margin-top: 10px; background: var(--record-bg); }
.member-reference-results .reference-record-table { min-width: 760px; }
.member-reference-results .reference-record-table td { max-width: 150px; }
.member-reference-results .reference-result-odds { display: block; white-space: nowrap; }
.reference-record-inline-detail { padding: 0; border: 0; border-radius: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; }
.reference-record-inline-detail:hover { text-decoration: underline; color: #83dcf0; }
.reference-record-inline-empty { grid-column: 1 / -1; min-height: 38px; display: grid; place-content: center; color: #b7c7cc; }
.modal.structured-modal.member-record-cancel { width: min(480px, calc(100vw - 24px)); height: auto; min-height: 0; max-height: calc(100dvh - 24px); display: flex; flex-direction: column; overflow: hidden; border: 1px solid #4c7580; border-radius: 3px; background: #161616; color: #edf2f3; }
.modal-backdrop:has(.member-record-cancel) { padding: 12px; place-items: center; }
.member-record-cancel .modal-head { min-height: 46px; padding: 8px 12px; background: #203e48; }
.member-record-cancel .modal-head h2 { font-size: 16px; }
.member-record-cancel .modal-body { min-height: 0; padding: 14px 12px; overflow-y: auto; font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
.member-record-cancel .modal-actions { padding: 8px 12px; border-top: 1px solid #26444c; }
@media (max-width: 1050px) {
  .reference-record-layout { grid-template-columns: 1fr; gap: 10px; }
  .reference-record-categories { display: flex; flex-wrap: wrap; gap: 2px; border: 0; }
  .reference-record-categories .reference-record-command { flex: 1 1 140px; width: auto; min-height: 36px; padding: 5px 8px; font-size: 12px; }
}
@media (max-width: 640px) {
  .reference-record-products { gap: 3px; padding-bottom: 10px; }
  .reference-record-products .reference-record-command { flex: 1 1 100px; min-height: 36px; }
  .reference-record-sorts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .reference-record-sorts .reference-record-command { min-width: 0; min-height: 36px; }
  .reference-record-search form { grid-template-columns: 1fr; }
  .reference-record-field :is(input, select) { height: 40px; font-size: 16px; }
  .member-record-detail-backdrop { padding: 0; }
  .member-record-detail { width: 100%; max-height: 100dvh; height: 100dvh; border-radius: 0; }
  .reference-record-detail-facts { grid-template-columns: 1fr; }
  .reference-record-detail-facts > div { grid-template-columns: 110px minmax(0, 1fr); }
  .reference-record-pagination { gap: 6px; }
  .reference-record-pagination .reference-record-command { min-width: 64px; min-height: 36px; }
}