/* Couple bet wheel: the bet card (a little contract), three steps, wheel, settle and head-to-head record. */
.tool .bw-card {
  position: relative; overflow: hidden; padding: 20px 20px 18px; border-radius: 24px; background: var(--surface);
  box-shadow: var(--shadow), inset 0 0 0 1px rgb(var(--ink) / .06); display: flex; flex-direction: column; gap: 10px;
}
.tool .bw-card-top { display: flex; justify-content: space-between; align-items: baseline; }
.tool .bw-eyebrow { font-size: 12px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; color: var(--link); }
.tool .bw-date { font-size: 13px; font-weight: 800; color: rgb(var(--ink) / .55); }
.tool .bw-vs { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin: 0; font-size: 28px; line-height: 34px; font-weight: 950; letter-spacing: -.015em; color: rgb(var(--ink)); }
.tool .bw-x { font-size: 15px; font-weight: 850; color: rgb(var(--ink) / .45); }
.tool .bw-name { transition: opacity .2s ease, color .2s ease; overflow-wrap: anywhere; }
.tool .bw-name.is-win { color: var(--link); }
.tool .bw-name.is-lose { opacity: .45; }
.tool .bw-line { display: flex; flex-direction: column; gap: 2px; margin: 0; }
.tool .bw-k { font-size: 12px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; color: rgb(var(--ink) / .5); }
.tool .bw-blank { font-size: 20px; line-height: 26px; font-weight: 900; color: rgb(var(--ink)); text-wrap: balance; }
.tool .bw-blank.is-empty { color: rgb(var(--ink) / .35); font-weight: 800; text-decoration: underline dashed rgb(var(--ink) / .25); text-underline-offset: 6px; }
.tool .bw-stamp {
  position: absolute; right: 16px; top: 14px; padding: 3px 9px; border: 3px solid rgb(var(--bw-stamp)); border-radius: 10px; color: rgb(var(--bw-stamp));
  font-size: 13px; font-weight: 950; letter-spacing: .06em; text-transform: uppercase; transform: rotate(-6deg); opacity: 0; pointer-events: none; max-width: 50%; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.tool { --bw-stamp: 192 35 122; }
@media (prefers-color-scheme: dark) { .tool { --bw-stamp: 255 120 190; } }
.tool .bw-card.is-locked .bw-stamp { opacity: .9; }
.tool .bw-card.is-stamp .bw-stamp { animation: bw-stamp .38s cubic-bezier(.2, 0, 0, 1) both; }
@keyframes bw-stamp { from { opacity: 0; transform: rotate(-6deg) scale(1.8); } to { opacity: .9; transform: rotate(-6deg) scale(1); } }
.tool .bw-card.is-locked .bw-vs { padding-right: 0; }

.tool .bw-draft, .tool .bw-locked { display: flex; flex-direction: column; gap: 14px; }
.tool .bw-draft[hidden], .tool .bw-locked[hidden] { display: none; }
.tool .bw-step { display: grid; grid-template-columns: 28px 1fr; gap: 12px; padding: 16px 16px 16px 12px; border-radius: 22px; background: var(--surface); }
.tool .bw-n { width: 28px; height: 28px; border-radius: 14px; display: grid; place-items: center; font-size: 14px; font-weight: 950; color: #fff; background: rgb(var(--accent)); }
.tool .bw-sbody { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.tool .bw-sbody > .tool-label { margin: 3px 0 0; font-size: 16px; font-weight: 900; color: rgb(var(--ink)); }
.tool .bw-names { gap: 10px; }
@media (max-width: 599px) { .tool .bw-names { grid-template-columns: 1fr 1fr; } }
.tool .bw-wrow { display: flex; flex-direction: column; gap: 8px; }
.tool .bw-idea { display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
.tool .bw-idea svg { width: 18px; height: 18px; }
.tool .bw-row { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 -4px; padding: 2px 4px; }
.tool .bw-row::-webkit-scrollbar { display: none; }
.tool .bw-row > button { flex: 0 0 auto; white-space: nowrap; }
.tool .bw-wheel { padding: 12px 0 2px; }
.tool .bw-wheel .rz-wheel { width: min(100%, 300px); }
.tool .bw-pick summary { min-height: 44px; display: flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 800; color: var(--link); cursor: pointer; list-style: none; }
.tool .bw-pick summary::-webkit-details-marker { display: none; }
.tool .bw-plist { display: grid; gap: 6px; margin-top: 6px; }
.tool .bw-plist button { width: 100%; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; text-align: left; padding: 10px 14px; border-radius: 14px; background: rgb(var(--ink) / .045); color: rgb(var(--ink)); }
.tool .bw-plist button b { font-size: 15px; font-weight: 850; }
.tool .bw-plist button span { font-size: 13px; line-height: 18px; font-weight: 650; color: rgb(var(--ink) / .65); }
.tool .bw-plist button[aria-pressed="true"] { background: rgb(var(--ink)); color: var(--surface); }
.tool .bw-plist button[aria-pressed="true"] span { color: inherit; opacity: .75; }
.tool .bw-lockrow .btn { width: 100%; }
.tool .bw-lnote { text-align: center; margin-top: -4px; }

.tool .bw-acts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.tool .bw-acts .btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 48px; width: 100%; padding: 0 10px; }
.tool .bw-acts .btn svg { width: 18px; height: 18px; flex: 0 0 auto; }
.tool .bw-settle { display: flex; flex-direction: column; gap: 10px; padding: 16px; border-radius: 22px; background: var(--surface); }
.tool .bw-settle[hidden] { display: none; }
.tool .bw-settle .tool-label { margin: 0; }
.tool .bw-settle .tool-cta { margin: 4px 0 0; text-align: left; }
.tool .bw-wins { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.tool .bw-win { min-height: 52px; font-size: 17px; font-weight: 900; width: 100%; overflow-wrap: anywhere; }
.tool .bw-owed { margin: 0; padding: 16px; border-radius: 22px; background: rgb(var(--accent) / .12); font-size: 18px; line-height: 25px; font-weight: 900; color: rgb(var(--ink)); text-align: center; text-wrap: balance; }
.tool .bw-owed[hidden] { display: none; }

.tool .bw-record { display: flex; flex-direction: column; gap: 8px; }
.tool .bw-record:empty { display: none; }
.tool .bw-score { display: flex; align-items: baseline; justify-content: center; gap: 14px; padding: 14px; border-radius: 20px; background: var(--surface); font-size: 16px; font-weight: 800; color: rgb(var(--ink) / .75); }
.tool .bw-score b { font-size: 30px; font-weight: 950; color: rgb(var(--ink)); font-variant-numeric: tabular-nums; }
.tool .bw-dash { font-size: 13px; color: rgb(var(--ink) / .45); }
.tool .bw-rlist { display: grid; gap: 6px; }
.tool .bw-rlist li { display: grid; grid-template-columns: 52px 1fr; gap: 8px; padding: 10px 14px; border-radius: 14px; background: var(--surface); }
.tool .bw-rd { font-size: 13px; font-weight: 850; color: rgb(var(--ink) / .5); padding-top: 1px; }
.tool .bw-rt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tool .bw-rt b { font-size: 15px; line-height: 20px; font-weight: 850; color: rgb(var(--ink)); }
.tool .bw-rt small { font-size: 13px; line-height: 18px; font-weight: 650; color: rgb(var(--ink) / .62); }
@media (prefers-color-scheme: dark) { .tool .bw-step .btn-secondary, .tool .bw-acts .btn-secondary, .tool .bw-win { box-shadow: inset 0 0 0 1px rgb(var(--ink) / .28); } }
@media (min-width: 600px) { .tool .bw-wrow { flex-direction: row; } .tool .bw-wrow input { flex: 1; } .tool .bw-vs { font-size: 34px; line-height: 40px; } }
@media (prefers-reduced-motion: reduce) { .tool .bw-card.is-stamp .bw-stamp { animation: none; } }

/* Round 2: date moves under the stamp, wrapped chip rows, reveal under the wheel, small idea button, paid toggle */
.tool .bw-card.is-locked .bw-date { visibility: hidden; }
.tool .bw-card.is-locked .bw-card-top::after { content: ""; }
.tool .bw-row { flex-wrap: wrap; overflow: visible; margin: 0; padding: 0; }
.tool .bw-reveal { display: flex; flex-direction: column; gap: 2px; padding: 14px 16px; border-radius: 18px; background: rgb(var(--accent) / .1); text-align: center; }
.tool .bw-reveal[hidden] { display: none; }
.tool .bw-reveal b { font-size: 20px; line-height: 26px; font-weight: 950; color: rgb(var(--ink)); text-wrap: balance; }
.tool .bw-idea { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 12px; border-radius: 20px; font-size: 14px; font-weight: 850; color: var(--link); box-shadow: inset 0 0 0 1.5px rgb(var(--accent) / .45); }
.tool .bw-idea svg { width: 16px; height: 16px; }
.tool .bw-idea:active { transform: scale(.96); }
.tool .bw-pick[open] { display: flex; flex-direction: column; gap: 8px; }
.tool .bw-rlist li { grid-template-columns: 52px 1fr auto; align-items: start; }
.tool .bw-paid { min-height: 32px; padding: 0 10px; border-radius: 16px; font-size: 12px; font-weight: 850; color: rgb(var(--bw-stamp)); box-shadow: inset 0 0 0 1.5px rgb(var(--bw-stamp) / .5); white-space: nowrap; }
.tool .bw-paid[aria-pressed="true"] { color: rgb(var(--ink) / .5); box-shadow: inset 0 0 0 1px rgb(var(--ink) / .2); }
.tool .bw-in { display: flex; flex-direction: column; gap: 10px; padding: 16px; border-radius: 22px; background: var(--surface); }
.tool .bw-in[hidden] { display: none; }
.tool .bw-in .tool-title { margin: 0; }
@media (max-width: 599px) { .tool .bw-in .bw-acts { grid-template-columns: 1fr; } }
/* Round 3: head to head on the card, compact blank card, sticky lock on phones */
.tool .bw-h2h { margin: 2px 0 0; padding-top: 10px; border-top: 1px solid rgb(var(--ink) / .08); font-size: 14px; font-weight: 850; color: var(--link); }
.tool .bw-h2h[hidden] { display: none; }
.tool .bw-card.is-blank { gap: 6px; padding-bottom: 14px; }
.tool .bw-card.is-blank .bw-line + .bw-line { display: none; }
.tool .bw-card.is-blank .bw-vs { font-size: 22px; line-height: 28px; }
@media (max-width: 599px) {
  .tool .bw-lockrow.is-ready { position: static; bottom: 0; z-index: 4; margin: 0 -8px; padding: 10px 8px; background: var(--bg); border-radius: 20px 20px 0 0; box-shadow: 0 -8px 20px rgb(var(--ink) / .08); }
  .tool .bw-lockrow .btn:disabled { opacity: .5; }
}
.tool .bw-blank { text-wrap: pretty; }
/* Round 5: chip rows scroll on phones, all bet ideas list */
@media (max-width: 599px) {
  .tool .bw-row { flex-wrap: nowrap; overflow-x: auto; margin: 0 -4px; padding: 2px 4px; -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
}
.tool .bw-allgrp { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.tool .bw-allgrp .tool-label { margin: 0; }
/* Round 6: no step numbers, wrapped chips everywhere, names on one line, lock hidden until ready, record controls */
.tool .bw-step { grid-template-columns: 1fr; padding: 16px; }
.tool .bw-row { flex-wrap: wrap; overflow: visible; margin: 0; padding: 0; -webkit-mask-image: none; mask-image: none; }
.tool .bw-row > button { white-space: normal; }
.tool .bw-shut { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 44px; font-size: 16px; font-weight: 750; color: rgb(var(--ink) / .7); }
.tool .bw-shut[hidden], .tool .bw-names[hidden], .tool .bw-sbody > .tool-label[hidden], .tool .bw-lockrow[hidden] { display: none; }
.tool .bw-who { color: rgb(var(--ink)); font-weight: 900; overflow-wrap: anywhere; }
.tool .bw-change { min-height: 44px; min-width: 44px; padding: 0 14px; border-radius: 22px; font-size: 14px; font-weight: 850; color: var(--link); box-shadow: inset 0 0 0 1.5px rgb(var(--accent) / .45); flex: 0 0 auto; }
.tool .bw-hint { margin: 0; font-size: 13px; line-height: 18px; }
.tool .bw-lhead { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: -6px; }
.tool .bw-lhead .tool-label { margin: 0; font-size: 16px; font-weight: 900; color: rgb(var(--ink)); }
.tool .bw-sbody .tool-actions { justify-content: center; }
.tool .bw-sbody .tool-actions .btn { width: 100%; }
.tool .bw-pick summary { text-align: center; }
.tool .rz-foot:empty { display: none; }
.tool .rz-foot .tool-cta { text-align: center; }
.tool .bw-acts .btn:only-child { grid-column: 1 / -1; }
.tool .bw-rnote { margin: -4px 0 2px; font-size: 13px; line-height: 18px; }
.tool .bw-split { margin: 0 0 2px; font-size: 14px; line-height: 20px; font-weight: 800; color: var(--link); }
.tool .bw-paid { min-height: 44px; min-width: 44px; display: inline-flex; align-items: center; gap: 8px; padding: 0 12px 0 10px; border-radius: 22px; font-size: 13px; color: rgb(var(--ink)); box-shadow: inset 0 0 0 1.5px rgb(var(--ink) / .22); }
.tool .bw-box { width: 18px; height: 18px; border-radius: 5px; display: grid; place-items: center; box-shadow: inset 0 0 0 2px rgb(var(--ink) / .45); }
.tool .bw-box svg { width: 14px; height: 14px; }
.tool .bw-paid[aria-pressed="true"] { color: rgb(var(--ink) / .6); box-shadow: inset 0 0 0 1px rgb(var(--ink) / .15); }
.tool .bw-paid[aria-pressed="true"] .bw-box { background: var(--link); color: var(--surface); box-shadow: none; }
.tool .bw-rlist li { align-items: center; }
.tool .bw-rlist li.is-paid .bw-rt { text-decoration: line-through; text-decoration-color: rgb(var(--ink) / .4); opacity: .6; }
.tool .bw-more[open] > .bw-rlist { margin-top: 0; }
.tool .bw-card.is-locked .bw-stamp { font-size: 16px; padding: 4px 11px; }
/* Dark wheel: light tints with dark labels, so wedges stay clear instead of muddy. */
@media (prefers-color-scheme: dark) {
  .tool .bw-wheel { --rz-1: #D9C2FF; --rz-2: #FFC2DE; --rz-3: #B4ECD5; --rz-4: #FFE0A8; --rz-5: #C6D7FF; --rz-ink: 38 8 64; }
}
/* Record rows: date and text on top, Mark paid under the text, so long bets do not squeeze into a column */
.tool .bw-rlist li { grid-template-columns: 52px 1fr; align-items: start; }
.tool .bw-rlist li .bw-paid { grid-column: 2; justify-self: start; }
@media (max-width: 599px) { .tool .bw-lockrow.is-ready { margin: 0; padding: 0; background: none; box-shadow: none; } }