/*
 * Canonical lane 4 wager widget styles shared by 19393 and 19595.
 * Keep host-page button rules from changing this component's geometry.
 */

/* Bowling lane 4 USDC wager widget */

.bowling-wager-backdrop[hidden],
.bowling-wager-tab-panel[hidden],
.bowling-wager-surface[hidden],
[data-wager-surface-panel][hidden],
.bowling-wager-live[hidden],
.bowling-wager-disabled[hidden],
.bowling-wager-progress[hidden],
.bowling-wager-result[hidden],
.bowling-wager-consent[hidden],
.bowling-wager-provider-list[hidden],
.bowling-wager-cancel-wait[hidden],
.bowling-wager-operation-blocker[hidden],
#bowling-wager-action-title[hidden] {
  display: none !important;
}

.bowling-wager-surface {
  min-width: 0;
}

.bowling-wager-modal,
.bowling-wager-modal *,
.bowling-wager-modal *::before,
.bowling-wager-modal *::after {
  box-sizing: border-box;
}

.bowling-wager-backdrop {
  position: fixed;
  inset: 0;
  z-index: 25080;
  pointer-events: none;
}

.bowling-wager-modal {
  position: fixed;
  top: 12px;
  right: 12px;
  display: flex;
  width: min(680px, calc(100vw - 24px));
  height: min(760px, calc(100dvh - 24px));
  min-width: min(360px, calc(100vw - 12px));
  min-height: min(300px, calc(100dvh - 12px));
  flex-direction: column;
  overflow: hidden;
  color: #eef3ff;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  border: 1px solid rgba(121, 171, 255, 0.55);
  border-radius: 20px;
  background: linear-gradient(160deg, rgba(17, 27, 61, 0.99), rgba(5, 9, 25, 0.99));
  box-shadow: 0 24px 90px rgba(0, 0, 0, 0.58), 0 0 36px rgba(80, 122, 255, 0.16);
  pointer-events: auto;
  isolation: isolate;
}

.bowling-wager-operation-blocker {
  position: fixed;
  inset: 0;
  z-index: 20;
  display: grid;
  padding: 20px;
  place-items: center;
  color: #eef5ff;
  background: rgba(3, 7, 19, 0.72);
  backdrop-filter: blur(6px) saturate(0.78);
  pointer-events: auto;
  cursor: wait;
  touch-action: none;
}

.bowling-wager-operation-card {
  display: grid;
  width: min(420px, calc(100vw - 32px));
  gap: 9px;
  justify-items: center;
  padding: 24px 22px;
  border: 1px solid rgba(133, 202, 255, 0.52);
  border-radius: 18px;
  background: linear-gradient(155deg, rgba(24, 42, 91, 0.98), rgba(7, 12, 31, 0.99));
  box-shadow: 0 24px 90px rgba(0, 0, 0, 0.7), 0 0 42px rgba(81, 155, 255, 0.2);
  text-align: center;
}

.bowling-wager-operation-spinner {
  width: 42px;
  height: 42px;
  margin-bottom: 3px;
  border: 4px solid rgba(146, 190, 255, 0.22);
  border-top-color: #9ae9ff;
  border-right-color: #8d9cff;
  border-radius: 50%;
  animation: bowling-wager-operation-spin 0.8s linear infinite;
}

.bowling-wager-operation-card strong {
  color: #f4f8ff;
  font: 850 17px/1.35 system-ui, sans-serif;
}

.bowling-wager-operation-card p {
  max-width: 34em;
  margin: 0;
  color: #c6d8f7;
  font: 650 12px/1.55 system-ui, sans-serif;
  white-space: pre-wrap;
}

.bowling-wager-operation-card small {
  color: #8da7d3;
  font: 600 10px/1.45 system-ui, sans-serif;
}

.bowling-wager-operation-active,
.bowling-wager-operation-active * {
  cursor: wait !important;
}

@keyframes bowling-wager-operation-spin {
  to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
  .bowling-wager-operation-spinner { animation-duration: 1.8s; }
}

.bowling-wager-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) repeat(3, auto);
  flex: 0 0 auto;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(139, 178, 255, 0.18);
  background: linear-gradient(90deg, rgba(50, 79, 174, 0.3), rgba(12, 20, 49, 0.35));
  cursor: grab;
  touch-action: none;
  user-select: none;
}

.bowling-wager-head button,
.bowling-wager-head a {
  touch-action: manipulation;
}

.bowling-wager-widget-moving,
.bowling-wager-widget-moving * {
  cursor: grabbing !important;
  user-select: none !important;
}

.bowling-wager-mark {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  color: #061025;
  font: 900 21px/1 system-ui, sans-serif;
  background: linear-gradient(145deg, #9ce6ff, #7e8fff);
  box-shadow: 0 0 20px rgba(109, 177, 255, 0.38);
}

.bowling-wager-heading {
  min-width: 0;
}

.bowling-wager-heading small {
  display: block;
  color: #8fbaff;
  font: 700 10px/1.2 system-ui, sans-serif;
  letter-spacing: 0.13em;
}

.bowling-wager-heading h2 {
  margin: 2px 0 0;
  font: 800 19px/1.25 system-ui, sans-serif;
}

.bowling-wager-compact-status,
#bowling-wager-compact-status {
  display: block;
  overflow: hidden;
  margin-top: 3px;
  color: #bdeeff;
  font: 750 11px/1.25 system-ui, sans-serif;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bowling-wager-compact-status[hidden],
#bowling-wager-compact-status[hidden] {
  display: none !important;
}

.bowling-wager-icon-button,
.bowling-wager-inline-actions button,
.bowling-wager-action-row button,
.bowling-wager-tabs button {
  border: 1px solid rgba(146, 179, 255, 0.25);
  color: #dce8ff;
  background: rgba(120, 151, 225, 0.1);
  cursor: pointer;
}

.bowling-wager-icon-button {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  padding: 0;
  border-radius: 10px;
  font: 700 20px/1 system-ui, sans-serif;
}

.bowling-wager-modal .bowling-wager-head > .bowling-wager-icon-button {
  padding: 0;
  border-radius: 10px;
}

.bowling-wager-icon-button:hover,
.bowling-wager-inline-actions button:hover,
.bowling-wager-action-row button:hover,
.bowling-wager-tabs button:hover {
  border-color: rgba(151, 205, 255, 0.72);
  background: rgba(113, 161, 255, 0.22);
}

.bowling-wager-modal button:focus-visible,
.bowling-wager-modal a:focus-visible,
.bowling-wager-modal input:focus-visible,
.bowling-wager-modal select:focus-visible,
.bowling-wager-modal textarea:focus-visible,
.bowling-wager-modal [tabindex]:focus-visible {
  outline: 2px solid #91e6ff;
  outline-offset: 2px;
}

.bowling-wager-modal .bowling-wager-history-button:focus-visible {
  outline-offset: -3px;
}

.bowling-wager-body {
  min-height: 0;
  flex: 1 1 auto;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 14px;
}

.bowling-wager-modal.is-collapsed {
  min-height: 0;
  height: auto !important;
  border-radius: 15px;
}

.bowling-wager-modal.is-collapsed .bowling-wager-head {
  border-bottom: 0;
}

.bowling-wager-modal.is-collapsed .bowling-wager-body,
.bowling-wager-modal.is-collapsed .bowling-wager-resize,
.bowling-wager-modal.is-collapsed #bowling-wager-resize {
  display: none !important;
}

.bowling-wager-resize,
#bowling-wager-resize {
  position: absolute;
  right: 2px;
  bottom: 2px;
  z-index: 3;
  width: 24px;
  height: 24px;
  border: 0;
  color: transparent;
  background:
    linear-gradient(135deg, transparent 45%, rgba(151, 205, 255, 0.32) 46%, rgba(151, 205, 255, 0.32) 53%, transparent 54%) 6px 6px / 10px 10px no-repeat,
    linear-gradient(135deg, transparent 45%, rgba(151, 205, 255, 0.68) 46%, rgba(151, 205, 255, 0.68) 53%, transparent 54%) 11px 11px / 10px 10px no-repeat;
  cursor: nwse-resize;
  touch-action: none;
}

.bowling-wager-status,
.bowling-wager-disabled {
  margin: 0 0 12px;
  padding: 10px 12px;
  border-radius: 10px;
  color: #cbd9f7;
  background: rgba(111, 142, 211, 0.1);
  font: 650 12px/1.45 system-ui, sans-serif;
}

.bowling-wager-status[data-tone="ready"] {
  color: #b9f9dd;
  background: rgba(61, 201, 142, 0.12);
}

.bowling-wager-status[data-tone="warn"] {
  color: #ffe6a9;
  background: rgba(255, 183, 68, 0.12);
}

.bowling-wager-status[data-tone="error"],
.bowling-wager-disabled {
  color: #ffc5d0;
  background: rgba(255, 83, 119, 0.12);
}

.bowling-wager-warning {
  display: flex;
  gap: 7px 12px;
  align-items: baseline;
  flex-wrap: wrap;
  margin-bottom: 12px;
  padding: 10px 12px;
  border: 1px solid rgba(255, 174, 89, 0.26);
  border-radius: 11px;
  background: rgba(90, 54, 21, 0.22);
}

.bowling-wager-warning strong {
  color: #ffd291;
  font: 800 12px/1.4 system-ui, sans-serif;
}

.bowling-wager-warning span {
  color: #dfc9aa;
  font: 600 11px/1.45 system-ui, sans-serif;
}

.bowling-wager-live {
  display: grid;
  min-width: 0;
  gap: 12px;
  container-type: inline-size;
}

.bowling-wager-live > .bowling-wager-warning {
  margin-bottom: 0;
}

.bowling-wager-live > .bowling-wager-wallet,
.bowling-wager-live > .bowling-wager-progress {
  margin: 0;
}

.bowling-wager-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin-bottom: 12px;
}

.bowling-wager-tabs button {
  min-height: 35px;
  border-radius: 10px;
  font: 750 12px/1 system-ui, sans-serif;
}

.bowling-wager-tabs button[aria-selected="true"] {
  color: #071126;
  border-color: transparent;
  background: linear-gradient(135deg, #99e6ff, #8797ff);
}

.bowling-wager-tab-panel {
  display: grid;
  gap: 10px;
}

.bowling-wager-overview,
.bowling-wager-wallet,
.bowling-wager-roster,
.bowling-wager-action,
.bowling-wager-progress,
.bowling-wager-result,
.bowling-wager-consent,
.bowling-wager-history-detail {
  padding: 12px;
  border: 1px solid rgba(139, 177, 255, 0.16);
  border-radius: 13px;
  background: rgba(9, 17, 40, 0.68);
}

.bowling-wager-overview dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.bowling-wager-overview dl > div {
  min-width: 0;
  padding: 8px;
  border-radius: 9px;
  background: rgba(98, 130, 207, 0.1);
}

.bowling-wager-overview dt {
  color: #8fa8d6;
  font: 700 10px/1.2 system-ui, sans-serif;
}

.bowling-wager-overview dd {
  overflow: hidden;
  margin: 4px 0 0;
  color: #f3f7ff;
  font: 800 13px/1.3 system-ui, sans-serif;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bowling-wager-section-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  margin-bottom: 9px;
}

.bowling-wager-section-head span:first-child {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}

.bowling-wager-roster .bowling-wager-section-head > .bowling-wager-roster-heading {
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 7px;
  align-items: baseline;
  white-space: nowrap;
}

.bowling-wager-roster .bowling-wager-roster-heading small::before {
  content: "· ";
}

.bowling-wager-section-head strong,
.bowling-wager-action > strong,
.bowling-wager-progress > strong,
.bowling-wager-result > strong,
.bowling-wager-consent > strong {
  color: #eef4ff;
  font: 800 13px/1.3 system-ui, sans-serif;
}

.bowling-wager-section-head small {
  overflow: hidden;
  color: #91a9d2;
  font: 600 11px/1.3 system-ui, sans-serif;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bowling-wager-inline-actions,
.bowling-wager-action-row {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.bowling-wager-inline-actions button,
.bowling-wager-action-row button {
  min-height: 31px;
  padding: 0 10px;
  border-radius: 9px;
  font: 700 11px/1 system-ui, sans-serif;
}

.bowling-wager-provider-list {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.bowling-wager-provider {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  min-height: 34px;
  padding: 0 11px;
  border: 1px solid rgba(139, 177, 255, 0.26);
  border-radius: 10px;
  color: #deebff;
  background: rgba(92, 131, 221, 0.13);
  font: 700 11px/1 system-ui, sans-serif;
  cursor: pointer;
}

.bowling-wager-provider img {
  width: 19px;
  height: 19px;
  border-radius: 5px;
}

.bowling-wager-primary {
  min-height: 38px;
  padding: 0 14px;
  border: 0;
  border-radius: 10px;
  color: #061024 !important;
  background: linear-gradient(135deg, #a2ecff, #8796ff) !important;
  box-shadow: 0 7px 22px rgba(89, 126, 255, 0.2);
  font: 850 12px/1 system-ui, sans-serif;
  cursor: pointer;
}

.bowling-wager-primary:disabled,
.bowling-wager-action-row button:disabled,
.bowling-wager-inline-actions button:disabled {
  opacity: 0.46;
  cursor: not-allowed;
  box-shadow: none;
}

.bowling-wager-cancel-wait,
#bowling-wager-cancel-wait {
  width: 100%;
  min-height: 36px;
  margin-top: 8px;
  border: 1px solid rgba(255, 111, 135, 0.48);
  border-radius: 10px;
  color: #ffd4dc;
  background: rgba(143, 37, 64, 0.2);
  font: 800 11px/1.2 system-ui, sans-serif;
  cursor: pointer;
}

.bowling-wager-cancel-wait:hover:not(:disabled),
#bowling-wager-cancel-wait:hover:not(:disabled) {
  border-color: rgba(255, 145, 165, 0.82);
  background: rgba(181, 45, 78, 0.32);
}

.bowling-wager-cancel-wait:disabled,
#bowling-wager-cancel-wait:disabled {
  cursor: not-allowed;
  opacity: 0.48;
}

.bowling-wager-footer-actions {
  display: grid;
  gap: 6px;
}

.bowling-wager-footer-actions > small {
  color: #829bc5;
  font: 650 10px/1.35 system-ui, sans-serif;
  text-align: center;
}

.bowling-wager-roster-list,
.bowling-wager-history-list {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.bowling-wager-roster-list:empty::after,
.bowling-wager-history-list:empty::after {
  content: "표시할 내역이 없습니다.";
  padding: 9px;
  color: #7f95bb;
  font: 600 11px/1.4 system-ui, sans-serif;
  text-align: center;
}

.bowling-wager-roster-item {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 3px 8px;
  align-items: center;
  padding: 8px 9px;
  border-radius: 9px;
  background: rgba(89, 119, 184, 0.1);
}

.bowling-wager-roster-item[data-state="verified"] {
  border: 1px solid rgba(83, 182, 255, 0.23);
  background: rgba(42, 121, 185, 0.13);
}

.bowling-wager-roster-item[data-state="funding"] {
  border: 1px solid rgba(199, 152, 255, 0.25);
  background: rgba(115, 70, 170, 0.13);
}

.bowling-wager-roster-item[data-state="funded"] {
  border: 1px solid rgba(85, 224, 165, 0.25);
  background: rgba(39, 148, 104, 0.13);
}

.bowling-wager-roster-item[data-state="forfeited"] {
  border: 1px solid rgba(255, 111, 132, 0.34);
  background: rgba(151, 43, 62, 0.16);
}

.bowling-wager-roster-avatar {
  position: relative;
  display: grid;
  grid-column: 1;
  grid-row: 1 / span 2;
  width: 32px;
  height: 32px;
  overflow: hidden;
  place-items: center;
  border: 2px solid color-mix(in srgb, var(--bowling-wager-player-color, #77d8ff) 72%, white 28%);
  border-radius: 50%;
  color: #071018;
  background: var(--bowling-wager-player-color, #77d8ff);
  box-shadow: 0 0 12px color-mix(in srgb, var(--bowling-wager-player-color, #77d8ff) 34%, transparent);
  font: 900 10px/1 system-ui, sans-serif;
}

.bowling-wager-roster-avatar img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.bowling-wager-roster-name {
  grid-column: 2;
  grid-row: 1;
  overflow: hidden;
  color: #e7efff;
  font: 750 12px/1.3 system-ui, sans-serif;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bowling-wager-roster-score,
.bowling-wager-roster-state {
  color: #92aad3;
  font: 650 10px/1.3 system-ui, sans-serif;
}

.bowling-wager-roster-score {
  grid-column: 2;
  grid-row: 2;
}

.bowling-wager-roster-state {
  grid-column: 3;
  grid-row: 1 / span 2;
  padding: 4px 7px;
  border-radius: 999px;
  background: rgba(131, 158, 218, 0.1);
}

.bowling-wager-roster-state[data-ready="true"] {
  color: #aaf1d2;
  background: rgba(52, 195, 137, 0.15);
}

.bowling-wager-roster-state[data-queued="true"] {
  color: #c6d8ff;
  background: rgba(112, 145, 225, 0.16);
}

.bowling-wager-roster-state[data-state="pending"] {
  color: #ffe0a8;
  background: rgba(181, 126, 45, 0.2);
}

.bowling-wager-roster-state[data-state="ready"],
.bowling-wager-roster-state[data-state="verified"] {
  color: #b9e7ff;
  background: rgba(42, 142, 205, 0.22);
}

.bowling-wager-roster-state[data-state="funding"] {
  color: #e3c2ff;
  background: rgba(130, 76, 188, 0.23);
}

.bowling-wager-roster-state[data-state="funded"] {
  color: #aaf1d2;
  background: rgba(52, 195, 137, 0.2);
}

.bowling-wager-roster-state[data-state="forfeited"] {
  color: #ffc0ca;
  background: rgba(211, 55, 84, 0.23);
}

.bowling-wager-roster-item[data-state="forfeited"] .bowling-wager-roster-score {
  color: #f4a6b4;
}

.bowling-wager-action p,
.bowling-wager-progress p,
.bowling-wager-result p,
.bowling-wager-consent p,
.bowling-wager-history-detail p {
  margin: 5px 0 10px;
  color: #aebfdd;
  font: 600 11px/1.55 system-ui, sans-serif;
  white-space: pre-wrap;
}

.bowling-wager-action[data-compact="true"] {
  display: grid;
  gap: 9px;
}

.bowling-wager-action[data-compact="true"] p {
  margin: 0;
  color: #c3d4f3;
  font-size: 11px;
  line-height: 1.4;
  text-align: center;
}

.bowling-wager-dispute-reason {
  display: grid;
  gap: 4px;
  margin: 0 0 9px;
  color: #aebfdd;
  font: 650 10px/1.3 system-ui, sans-serif;
}

.bowling-wager-dispute-reason[hidden] {
  display: none !important;
}

.bowling-wager-dispute-reason input {
  min-height: 34px;
  padding: 0 9px;
  border: 1px solid rgba(142, 178, 249, 0.22);
  border-radius: 9px;
  color: #edf4ff;
  background: rgba(4, 10, 25, 0.62);
  font: 650 11px/1.3 system-ui, sans-serif;
}

.bowling-wager-action > button {
  width: 100%;
}

.bowling-wager-progress {
  border-color: rgba(116, 175, 255, 0.3);
  background: rgba(40, 77, 153, 0.14);
}

.bowling-wager-progress a,
.bowling-wager-history-detail a {
  color: #91d9ff;
  font: 700 11px/1.4 system-ui, sans-serif;
}

.bowling-wager-consent {
  border-color: rgba(214, 170, 255, 0.35);
  background: rgba(111, 65, 160, 0.14);
}

/* The settlement surface should read as the screen of the lane-side terminal,
 * not as a second generic app panel. Keep the treatment quiet enough that
 * names, scores, and payout actions remain the strongest information. */
.bowling-wager-modal[data-wager-surface="terminal"] {
  border: 2px solid rgba(93, 180, 184, 0.5);
  border-radius: 12px;
  background:
    radial-gradient(circle at 78% -18%, rgba(61, 208, 194, 0.12), transparent 38%),
    linear-gradient(155deg, #0b1723, #050b12 72%);
  box-shadow:
    0 24px 90px rgba(0, 0, 0, 0.66),
    0 0 30px rgba(59, 200, 189, 0.1),
    inset 0 0 0 4px rgba(3, 9, 15, 0.72),
    inset 0 0 32px rgba(65, 217, 203, 0.05);
}

.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-head {
  border-bottom-color: rgba(105, 221, 207, 0.2);
  background: linear-gradient(90deg, rgba(22, 74, 78, 0.42), rgba(7, 20, 29, 0.78));
}

.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-mark {
  border: 1px solid rgba(118, 235, 218, 0.42);
  border-radius: 7px;
  color: #9df3df;
  background: #071820;
  box-shadow: inset 0 0 12px rgba(76, 223, 202, 0.16), 0 0 14px rgba(69, 213, 197, 0.12);
  font-family: ui-monospace, "SFMono-Regular", Consolas, monospace;
}

.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-heading small {
  color: #77d9cb;
}

.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-body {
  background: linear-gradient(180deg, rgba(3, 11, 18, 0.5), rgba(3, 8, 14, 0.76));
}

.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-status,
.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-disabled,
.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-warning,
.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-wallet,
.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-progress {
  border-radius: 8px;
}

.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-wallet,
.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-progress {
  border-color: rgba(99, 197, 190, 0.22);
  background: rgba(5, 18, 26, 0.86);
  box-shadow: inset 0 0 18px rgba(62, 207, 191, 0.035);
}

.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-progress {
  border-left: 3px solid rgba(92, 220, 204, 0.62);
}

.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-icon-button:focus-visible,
.bowling-wager-modal[data-wager-surface="terminal"] button:focus-visible,
.bowling-wager-modal[data-wager-surface="terminal"] a:focus-visible,
.bowling-wager-modal[data-wager-surface="terminal"] input:focus-visible {
  outline-color: #78ead8;
}

.bowling-wager-terminal-surface {
  position: relative;
  display: grid;
  min-width: 0;
  gap: 10px;
  isolation: isolate;
  overflow: hidden;
  padding: 10px;
  border: 1px solid rgba(93, 216, 202, 0.25);
  border-radius: 8px;
  background:
    radial-gradient(circle at 50% 0, rgba(57, 207, 191, 0.075), transparent 46%),
    #06111a;
  box-shadow:
    inset 0 0 0 2px rgba(1, 7, 12, 0.55),
    inset 0 0 24px rgba(56, 204, 188, 0.045);
}

.bowling-wager-terminal-surface::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.055;
  background: repeating-linear-gradient(
    to bottom,
    transparent 0,
    transparent 3px,
    rgba(139, 255, 236, 0.24) 3px,
    rgba(139, 255, 236, 0.24) 4px
  );
}

.bowling-wager-terminal-surface > * {
  position: relative;
  z-index: 1;
}

.bowling-wager-terminal-banner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid rgba(103, 226, 209, 0.2);
  border-radius: 6px;
  background: rgba(8, 31, 39, 0.84);
  box-shadow: inset 0 0 16px rgba(70, 214, 197, 0.045);
}

.bowling-wager-terminal-banner > span:last-child {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.bowling-wager-terminal-banner strong {
  color: #d9fff7;
  font: 800 12px/1.3 system-ui, sans-serif;
}

.bowling-wager-terminal-banner small {
  overflow: hidden;
  color: #8ebbb5;
  font: 600 10px/1.35 system-ui, sans-serif;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bowling-wager-terminal-lights {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 5px;
  align-items: center;
  padding: 6px 7px;
  border: 1px solid rgba(103, 226, 209, 0.13);
  border-radius: 5px;
  background: rgba(1, 9, 14, 0.7);
}

.bowling-wager-terminal-lights i {
  display: block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #4e5e66;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
}

.bowling-wager-terminal-lights i:nth-child(1) {
  background: #bd6572;
  box-shadow: 0 0 6px rgba(211, 91, 111, 0.25);
}

.bowling-wager-terminal-lights i:nth-child(2) {
  background: #c79a58;
  box-shadow: 0 0 6px rgba(230, 175, 88, 0.25);
}

.bowling-wager-terminal-lights i:nth-child(3) {
  background: #6ce0b0;
  box-shadow: 0 0 8px rgba(89, 237, 177, 0.52);
}

.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-history-item {
  border-color: rgba(103, 205, 195, 0.17);
  border-radius: 7px;
  background: rgba(4, 14, 22, 0.88);
}

.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-history-button {
  background: rgba(34, 91, 99, 0.055);
}

.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-history-button:hover,
.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-history-button[aria-expanded="true"] {
  background: rgba(52, 134, 137, 0.16);
}

.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-history-item[data-self-claimable="true"] {
  border-color: rgba(244, 194, 86, 0.38);
  box-shadow: inset 3px 0 0 rgba(246, 198, 92, 0.72);
}

.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-history-item[data-self-claimable="true"] .bowling-wager-history-button {
  background: linear-gradient(90deg, rgba(167, 111, 27, 0.12), rgba(34, 91, 99, 0.055) 44%);
}

.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-history-detail {
  border-top-color: rgba(104, 211, 199, 0.14);
}

.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-history-chevron {
  color: #91dcd1;
  background: rgba(80, 172, 166, 0.12);
}

.bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-history-button[aria-expanded="true"] .bowling-wager-history-chevron {
  background: rgba(90, 205, 193, 0.19);
}

.bowling-wager-history-layout {
  display: block;
  container-type: inline-size;
}

.bowling-wager-history-list {
  display: grid;
  max-height: none;
  gap: 8px;
  overflow: visible;
}

.bowling-wager-history-item {
  display: grid;
  overflow: hidden;
  border: 1px solid rgba(133, 171, 247, 0.18);
  border-radius: 12px;
  background: rgba(9, 17, 40, 0.68);
}

.bowling-wager-modal .bowling-wager-history-button {
  display: grid;
  width: 100%;
  min-height: 48px;
  grid-template-columns: minmax(0, 1fr) 28px;
  gap: 10px;
  align-items: center;
  padding: 9px 10px 9px 12px;
  border: 0;
  border-radius: 0;
  color: #e8f0ff;
  background: rgba(88, 115, 180, 0.08);
  font: 700 11px/1.35 system-ui, sans-serif;
  text-align: left;
  cursor: pointer;
}

.bowling-wager-modal .bowling-wager-history-button:hover,
.bowling-wager-modal .bowling-wager-history-button[aria-expanded="true"] {
  background: rgba(92, 134, 229, 0.18);
}

.bowling-wager-history-summary-copy {
  display: grid;
  grid-template-columns: max-content minmax(0, max-content) minmax(120px, 1fr) max-content;
  min-width: 0;
  gap: 10px;
  align-items: center;
}

.bowling-wager-history-time {
  color: #c7d5ef;
  font: 750 11px/1.2 system-ui, sans-serif;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.bowling-wager-history-state {
  overflow: hidden;
  max-width: 100%;
  padding: 4px 7px;
  border: 1px solid rgba(130, 178, 255, 0.2);
  border-radius: 999px;
  color: #b9d4ff;
  background: rgba(74, 122, 217, 0.14);
  font: 750 10px/1 system-ui, sans-serif;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bowling-wager-history-count {
  color: #8299c0;
  font: 700 10px/1.2 system-ui, sans-serif;
  white-space: nowrap;
}

.bowling-wager-history-people-summary {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 6px;
  overflow: hidden;
}

.bowling-wager-history-summary-separator {
  flex: 0 0 auto;
  color: rgba(132, 157, 197, 0.58);
  font: 800 10px/1 system-ui, sans-serif;
}

.bowling-wager-history-winner {
  display: inline-flex;
  min-width: 0;
  align-items: baseline;
  gap: 4px;
  overflow: hidden;
  white-space: nowrap;
}

.bowling-wager-history-winner small {
  flex: 0 0 auto;
  color: #b89b61;
  font: 700 9px/1 system-ui, sans-serif;
}

.bowling-wager-history-winner strong {
  min-width: 0;
  overflow: hidden;
  color: #ffe09a;
  font: 800 10px/1.2 system-ui, sans-serif;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bowling-wager-history-claim-badge {
  flex: 0 0 auto;
  padding: 4px 7px;
  border: 1px solid rgba(255, 211, 106, 0.42);
  border-radius: 999px;
  color: #ffe6a6;
  background: rgba(166, 116, 25, 0.2);
  font: 800 10px/1 system-ui, sans-serif;
  white-space: nowrap;
}

.bowling-wager-history-state[data-state="settled"],
.bowling-wager-history-state[data-state="paid"],
.bowling-wager-history-state[data-state="claimed"] {
  border-color: rgba(93, 224, 166, 0.24);
  color: #aaf1d2;
  background: rgba(42, 171, 116, 0.13);
}

.bowling-wager-history-state[data-state="disputed"] {
  border-color: rgba(255, 126, 146, 0.28);
  color: #ffb5c1;
  background: rgba(181, 55, 81, 0.15);
}

.bowling-wager-history-state[data-state="refunding"],
.bowling-wager-history-state[data-state="refundable"] {
  border-color: rgba(255, 198, 103, 0.27);
  color: #ffd58c;
  background: rgba(190, 126, 37, 0.14);
}

.bowling-wager-history-pot {
  display: inline-flex;
  align-items: baseline;
  justify-self: end;
  gap: 5px;
  white-space: nowrap;
}

.bowling-wager-history-pot small {
  color: #7f98c4;
  font: 650 9px/1 system-ui, sans-serif;
}

.bowling-wager-history-pot strong {
  color: #9ddfff;
  font: 800 11px/1 system-ui, sans-serif;
}

.bowling-wager-history-chevron {
  display: grid;
  width: 28px;
  height: 28px;
  align-self: center;
  justify-self: end;
  place-items: center;
  border-radius: 8px;
  color: #a9c7f8;
  background: rgba(116, 153, 230, 0.12);
  line-height: 0;
  transition: background 140ms ease;
}

.bowling-wager-history-chevron svg {
  display: block;
  width: 14px;
  height: 14px;
  overflow: visible;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transform: rotate(0deg);
  transform-origin: 50% 50%;
  transition: transform 140ms ease;
}

.bowling-wager-history-button[aria-expanded="true"] .bowling-wager-history-chevron {
  background: rgba(116, 190, 255, 0.2);
}

.bowling-wager-history-button[aria-expanded="true"] .bowling-wager-history-chevron svg {
  transform: rotate(180deg);
}

.bowling-wager-history-detail {
  display: grid;
  gap: 9px;
  padding: 0 12px 12px;
  border: 0;
  border-top: 1px solid rgba(141, 174, 238, 0.12);
  border-radius: 0;
  background: transparent;
}

.bowling-wager-history-detail > p {
  margin: 10px 0 0;
  color: #9fb3d7;
  font: 650 10px/1.4 system-ui, sans-serif;
}

.bowling-wager-history-participants {
  display: grid;
  gap: 6px;
}

.bowling-wager-history-person {
  display: grid;
  width: 100%;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  min-width: 0;
  padding: 7px 9px 7px 7px;
  border: 1px solid rgba(137, 174, 242, 0.14);
  border-radius: 10px;
  background: rgba(83, 111, 176, 0.1);
}

.bowling-wager-history-person[data-winner="true"] {
  border-color: rgba(255, 211, 106, 0.42);
  background: linear-gradient(90deg, rgba(166, 116, 25, 0.18), rgba(83, 111, 176, 0.08));
  box-shadow: inset 3px 0 rgba(255, 211, 106, 0.72);
}

.bowling-wager-history-person[data-forfeited="true"] {
  border-color: rgba(255, 112, 134, 0.3);
  background: rgba(157, 48, 67, 0.16);
}

.bowling-wager-history-avatar {
  position: relative;
  display: grid;
  width: 30px;
  height: 30px;
  overflow: hidden;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--bowling-wager-player-color, #77d8ff) 72%, white 28%);
  border-radius: 50%;
  color: #071018;
  background: var(--bowling-wager-player-color, #77d8ff);
  font: 900 9px/1 system-ui, sans-serif;
}

.bowling-wager-history-avatar img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.bowling-wager-history-person-copy {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.bowling-wager-history-name {
  overflow: hidden;
  max-width: 100%;
  font: 800 11px/1.25 system-ui, sans-serif;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bowling-wager-history-person-meta {
  color: #9fb3d7;
  font: 650 9px/1.25 system-ui, sans-serif;
}

.bowling-wager-history-person[data-winner="true"] .bowling-wager-history-person-meta {
  color: #ffe09a;
}

.bowling-wager-history-person[data-forfeited="true"] .bowling-wager-history-person-meta {
  color: #f1a7b4;
}

.bowling-wager-history-payout {
  display: grid;
  gap: 8px;
  margin-top: 10px;
  padding: 10px;
  border: 1px solid rgba(113, 210, 255, 0.28);
  border-radius: 10px;
  background: rgba(70, 133, 199, 0.12);
}

.bowling-wager-history-payout p {
  margin: 0;
  color: #aebfdf;
  font: 600 10px/1.45 system-ui, sans-serif;
}

.bowling-wager-history-dispute {
  display: grid;
  min-width: 0;
  gap: 5px;
  color: #aebfdd;
  font: 700 10px/1.3 system-ui, sans-serif;
}

.bowling-wager-history-dispute input {
  width: 100%;
  min-width: 0;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid rgba(133, 181, 239, 0.3);
  border-radius: 8px;
  color: #edf7ff;
  caret-color: #8be8da;
  background: rgba(3, 11, 20, 0.84);
  font: 650 11px/1.35 system-ui, sans-serif;
}

.bowling-wager-history-dispute input::placeholder {
  color: #708aa5;
  opacity: 1;
}

.bowling-wager-history-dispute input:focus-visible {
  border-color: rgba(116, 236, 218, 0.72);
  box-shadow: 0 0 0 3px rgba(80, 215, 197, 0.12);
}

.bowling-wager-history-payout-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.bowling-wager-history-payout-button {
  min-height: 34px;
  padding: 7px 11px;
  border: 1px solid rgba(132, 217, 255, 0.48);
  border-radius: 9px;
  color: #07152a;
  background: linear-gradient(135deg, #9ceaff, #94aaff);
  font: 800 11px/1.2 system-ui, sans-serif;
  cursor: pointer;
}

.bowling-wager-history-payout-button:disabled {
  cursor: not-allowed;
  filter: saturate(0.35);
  opacity: 0.48;
}

/* Host pages have broad pill-button rules. Component geometry wins here. */
.bowling-wager-modal .bowling-wager-tabs button,
.bowling-wager-modal .bowling-wager-primary,
.bowling-wager-modal .bowling-wager-cancel-wait,
.bowling-wager-modal .bowling-wager-inline-actions button,
.bowling-wager-modal .bowling-wager-action-row button,
.bowling-wager-modal .bowling-wager-history-payout-button {
  border-radius: 10px;
}

@media (max-width: 680px) {
  .bowling-wager-modal {
    max-width: calc(100vw - 12px);
    max-height: calc(100dvh - 12px);
    border-radius: 16px;
  }

  .bowling-wager-head {
    grid-template-columns: auto minmax(0, 1fr) repeat(3, 32px);
    gap: 6px;
    padding: 10px;
  }

  .bowling-wager-mark {
    width: 32px;
    height: 32px;
    font-size: 18px;
  }

  .bowling-wager-heading h2 {
    font-size: 16px;
  }

  .bowling-wager-icon-button {
    width: 32px;
    height: 32px;
  }

  .bowling-wager-body {
    padding: 11px;
  }

  .bowling-wager-terminal-surface {
    padding: 8px;
  }

  .bowling-wager-overview dl {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .bowling-wager-modal .bowling-wager-history-button {
    gap: 6px;
    padding-inline: 9px 8px;
  }

  .bowling-wager-history-summary-copy {
    gap: 6px;
  }
}

@container (max-width: 520px) {
  .bowling-wager-history-summary-copy {
    grid-template-columns: minmax(0, 1fr) max-content;
    gap: 5px 8px;
  }

  .bowling-wager-history-time {
    grid-column: 1;
    grid-row: 1;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .bowling-wager-history-pot {
    grid-column: 2;
    grid-row: 1;
  }

  .bowling-wager-history-state {
    grid-column: 1;
    grid-row: 2;
    justify-self: start;
  }

  .bowling-wager-history-people-summary {
    grid-column: 1 / -1;
    grid-row: 3;
    width: 100%;
    flex-wrap: wrap;
    overflow: visible;
  }

  .bowling-wager-history-winner {
    flex: 1 1 110px;
  }
}

@container (max-width: 420px) {
  .bowling-wager-wallet .bowling-wager-section-head {
    flex-direction: column;
    align-items: stretch;
  }

  .bowling-wager-wallet .bowling-wager-inline-actions {
    width: 100%;
  }

  .bowling-wager-wallet .bowling-wager-inline-actions button {
    min-height: 36px;
    flex: 1 1 auto;
  }

  .bowling-wager-terminal-banner {
    gap: 8px;
    padding: 8px;
  }

  .bowling-wager-terminal-banner small {
    white-space: normal;
  }

  .bowling-wager-history-payout-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .bowling-wager-history-payout-button {
    width: 100%;
    min-height: 42px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .bowling-wager-operation-spinner {
    animation: none;
  }

  .bowling-wager-history-chevron svg {
    transition: none;
  }
}

@media (prefers-reduced-transparency: reduce) {
  .bowling-wager-modal[data-wager-surface="terminal"] {
    background: #07111a;
    box-shadow: 0 18px 60px rgba(0, 0, 0, 0.72), inset 0 0 0 3px #02070c;
  }

  .bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-body,
  .bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-wallet,
  .bowling-wager-modal[data-wager-surface="terminal"] .bowling-wager-progress,
  .bowling-wager-terminal-surface,
  .bowling-wager-terminal-banner {
    background: #07131c;
  }

  .bowling-wager-terminal-surface::after {
    display: none;
  }
}