/* BOUT: a shared seam, bilateral navigation and two cut-corner actions. */
:root { --bout-nav-space: 88px; --bout-nav-lift: 0px; }
html { scroll-padding-top: calc(var(--bout-nav-space) + 24px); scrollbar-gutter: stable; overflow-anchor: none; }
body { padding-top: var(--bout-nav-space); }
.bout-demo-page { padding-top: 0; --bout-steel: #0d1512; --bc-ease: var(--ease-out-expo); }
.bout-demo .bout-cta-primary, .bout-demo .bout-cta-secondary { display: inline-flex; justify-content: space-between; align-items: center; border-radius: 0; font: 500 16px/1.4 var(--font-body); text-transform: none; letter-spacing: normal; }
main, section, header, footer, form, article, aside { min-width: 0; }

/* Reserve the full bar height. Scroll changes only painted transforms. */
.bout-nav { position: fixed; inset: 0 auto auto 0; width: var(--bout-page-width, 100%); height: var(--bout-nav-space); min-height: 0; z-index: 100; grid-template-columns: minmax(120px, var(--nav-seam, calc(50% + var(--seam-offset, 0px)))) minmax(120px, 1fr); padding: 0; background: transparent; isolation: isolate; }
.bout-nav::before { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, var(--card) var(--nav-seam, calc(50% + var(--seam-offset, 0px))), var(--bout-steel) var(--nav-seam, calc(50% + var(--seam-offset, 0px)))); border-bottom: 1px solid var(--line); transform-origin: top; transition: transform 260ms var(--bc-ease); z-index: -1; }
.bout-nav.is-condensed { --bout-nav-lift: -8px; }
.bout-nav.is-condensed::before { transform: scaleY(.82); }
.bout-nav__light, .bout-nav__dark { padding-block: 0; gap: 24px; background: transparent; transform: translateY(var(--bout-nav-lift)); transition: transform 260ms var(--bc-ease); font: 400 16px/1.3 var(--font-body); }
.bout-nav__light { justify-content: flex-end; padding-left: 24px; padding-right: 96px; color: var(--ink); }
.bout-nav__dark { justify-content: flex-start; padding-left: 96px; padding-right: 224px; color: var(--card); }
.bout-nav a[data-nav-key] { min-height: 44px; padding-inline: 4px; }
.bout-nav a[data-nav-key]::after { display: none; }
.bout-nav a[data-nav-key]:hover { text-decoration: underline; text-underline-offset: 6px; }
.bout-nav a[aria-current] { font-weight: 500; }
.bout-wordmark { left: var(--nav-seam, calc(50% + var(--seam-offset, 0px))); width: 160px; transform: translate(-50%, var(--bout-nav-lift)); transition: transform 260ms var(--bc-ease); }
.bout-wallet-slot { position: absolute; inset: 0 20px 0 auto; display: flex; align-items: center; }
.bout-wallet { margin: 0; gap: 4px; }
.bout-wallet #navCa, .bout-wallet .wallet-icon { display: none; }
.bout-wallet #navConnect { overflow: visible; text-overflow: clip; height: auto; min-height: 44px; padding: 12px 16px; font: 500 15px/1.3 var(--font-body); }
.bout-nav-indicator { position: absolute; width: 40px; height: 2px; left: 0; top: 0; pointer-events: none; background: var(--ink); transform: translate(0, 68px); z-index: 4; }
.bout-nav-indicator.is-dark { background: var(--card); }
.bout-nav-current { display: none; }
.bout-nav-sheet { padding: 0; gap: 0; background: transparent; color: var(--ink); height: 100dvh; min-height: 0; overflow-y: auto; overscroll-behavior: contain; isolation: isolate; }
.bout-nav-scrim { position: absolute; inset: 0; z-index: -3; background: var(--bout-steel); }
.bout-sheet-half { position: fixed; top: 0; bottom: 0; width: 50%; pointer-events: none; z-index: -2; transition: transform 280ms var(--bc-ease); }
.bout-sheet-half--light { left: 0; background: var(--card); transform: translateX(-100%); }
.bout-sheet-half--dark { right: 0; background: var(--bout-steel); transform: translateX(100%); }
.bout-nav-sheet.is-open .bout-sheet-half { transform: translateX(0); }
.bout-sheet-head { display: flex; justify-content: space-between; align-items: center; min-height: 72px; padding: max(12px, env(safe-area-inset-top)) 20px 12px; }
.bout-sheet-brand { font: 500 28px/1 "Bodoni Moda", serif; }
.bout-sheet-head .bout-menu-close { color: var(--card); --cta-surface: var(--bout-steel); }
.bout-sheet-links { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start; gap: 24px 0; padding: max(32px, calc(25dvh - 72px)) 16px 32px; min-height: 280px; }
.bout-sheet-links a[data-nav-key] { min-width: 0; font: 400 clamp(28px, 7.2vw, 36px)/1.2 var(--font-display); letter-spacing: 0; white-space: normal; min-height: 64px; padding: 10px 12px; opacity: 0; transform: translateX(16px); transition: transform 260ms var(--bc-ease), opacity 260ms var(--bc-ease); }
.bout-sheet-links a:nth-child(1), .bout-sheet-links a:nth-child(2) { grid-column: 1; justify-content: flex-end; color: var(--ink); }
.bout-sheet-links a:nth-child(3), .bout-sheet-links a:nth-child(4) { grid-column: 2; color: var(--card); transform: translateX(-16px); }
.bout-sheet-links a:nth-child(1) { grid-row: 1; transition-delay: 40ms; }
.bout-sheet-links a:nth-child(2) { grid-row: 2; transition-delay: 80ms; }
.bout-sheet-links a:nth-child(3) { grid-row: 3; transition-delay: 120ms; }
.bout-sheet-links a:nth-child(4) { grid-row: 4; transition-delay: 160ms; }
.bout-nav-sheet.is-open .bout-sheet-links a { opacity: 1; transform: translateX(0); }
.bout-sheet-wallet { align-self: end; padding: 24px 24px max(32px, env(safe-area-inset-bottom)); display: flex; justify-content: center; }
.bout-sheet-wallet .bout-wallet { width: 100%; }
.bout-sheet-wallet #navConnect { width: 100%; min-height: 52px; }
.bout-sheet-wallet .bout-cta-primary { background: var(--accent); color: var(--ink); border: 0; }
.bout-sheet-open { overflow: hidden; overscroll-behavior: none; }
.bout-sheet-open .bout-nav-sheet { touch-action: pan-y; }

/* One cut, an inset bracket edge and a directional arrow. No label replacement. */
.bout-cta-primary, .bout-cta-secondary { --cta-surface: var(--card); position: relative; isolation: isolate; min-height: 48px; min-width: 44px; padding: 12px 20px; gap: 12px; border-radius: 0; font: 500 16px/1.4 var(--font-body); text-transform: none; letter-spacing: normal; text-decoration: none; overflow-wrap: normal; cursor: pointer; transition: transform 240ms var(--bc-ease), opacity 240ms var(--bc-ease); }
.bout-cta-primary { border: 0; background: var(--accent); color: var(--ink); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%); }
.bout-cta-primary::before { content: ''; position: absolute; inset: 0; z-index: -1; background: currentColor; opacity: .06; transform: scaleX(0); transform-origin: left; transition: transform 240ms var(--bc-ease); }
.bout-cta-secondary { border: 1px solid currentColor; background: transparent; color: inherit; clip-path: polygon(10px 0, 100% 0, 100% 100%, 0 100%, 0 10px); }
.bout-cta-secondary::before { content: ''; position: absolute; width: 14px; height: 1px; left: -2px; top: 4px; background: currentColor; transform: rotate(-45deg); pointer-events: none; }
.bout-cta-primary::after, .bout-cta-secondary::after { content: '\2192'; display: inline-block; flex: none; font: inherit; transform: translateX(0); transition: transform 240ms var(--bc-ease); }
.bout-cta-primary > [aria-hidden=true], .bout-cta-secondary > [aria-hidden=true]:not(.bc-chevron) { display: none; }
.bout-cta-primary:hover { background: var(--accent); color: var(--ink); text-decoration: none; }
.bout-cta-primary:hover::before { transform: scaleX(1); }
.bout-cta-secondary:hover { background: var(--band); color: var(--ink); text-decoration: none; }
.bout-cta-primary:hover::after, .bout-cta-secondary:hover::after { transform: translateX(4px); }
.bout-cta-primary:active, .bout-cta-secondary:active { transform: translateY(1px); }
.bout-cta-primary:active::before { background: currentColor; transform: scaleX(1); }
.bout-cta-primary:active { color: var(--ink); }
.bout-cta-primary:focus-visible, .bout-cta-secondary:focus-visible { outline: 2px solid currentColor !important; outline-offset: -5px !important; }
.bout-cta-primary:disabled, .bout-cta-secondary:disabled, [aria-disabled=true].bout-cta-primary, [aria-disabled=true].bout-cta-secondary { opacity: .5; cursor: not-allowed; transform: none; pointer-events: none; }
.bout-cta-primary:disabled::before { transform: scaleX(0); }
.bout-nav__dark .bout-cta-primary { background: var(--accent); color: var(--ink); }
.bout-nav__dark .bout-cta-primary:hover { color: var(--ink); }
.bout-nav__dark .bout-cta-primary::before, .bout-arena__foot .bout-cta-primary::before { transform-origin: left; }
.bout-arena__foot .bout-cta-primary { border: 1px solid var(--card); }
.bout-cta-secondary.bc-copy::after { position: static; width: auto; height: auto; border: 0; }
.bout-cta-secondary.bc-copy.is-copied::after { content: '\2713'; transform: none; }
/* Selection, tab and list semantics keep their layout; the cut belongs to actions. */
.bout-side, .bout-match, .bc-option, .bc-select-trigger, .bc-tabs .bc-button, .bout-state-steps .bc-button { clip-path: none; }
.bout-side::before, .bout-side::after, .bout-match::before, .bout-match::after, .bc-option::before, .bc-option::after, .bc-select-trigger::before, .bc-select-trigger::after, .bc-tabs .bc-button::before, .bc-tabs .bc-button::after, .bout-state-steps .bc-button::before, .bout-state-steps .bc-button::after { content: none; }
.bc-quick .bout-cta-secondary { padding: 12px 4px; gap: 4px; font-size: 12px; }
.bc-quick .bout-cta-secondary::after { font-size: 12px; }
.bc-quick .bout-cta-secondary[aria-pressed=true] { background: var(--band); color: var(--ink); }
.bc-choice .bout-side[aria-checked=true] { box-shadow: inset 0 -3px var(--accent); }
.bc-choice__indicator { background: currentColor; }
.bc-range::-webkit-slider-thumb { background: currentColor; clip-path: polygon(12px 6px, 32px 6px, 32px 38px, 12px 38px); }
.bc-range::-moz-range-thumb { background: currentColor; clip-path: polygon(12px 6px, 32px 6px, 32px 38px, 12px 38px); }
.bout-menu-toggle::after, .bout-menu-close::after { content: none; }

/* Intrinsic sizing: labels may reflow, numeric figures remain whole. */
.bc-number, .bout-digit, .bout-demo__roll { white-space: nowrap; overflow-wrap: normal; word-break: normal; }
.bout-tape dl > div { justify-items: start; text-align: left; grid-template-rows: auto; min-width: 0; }
.bout-tape__corner--B dl > div { justify-items: end; text-align: right; }
.bout-tape .bc-readout, .bout-tape .bc-tape-meaning { text-align: inherit; max-width: 100%; }
.bout-tape .bc-number--standalone { text-align: inherit; }
.bout-tape .bc-tape-meaning { white-space: normal; }
.bout-tape__corner { grid-template-rows: auto auto auto auto 1fr; }
.bout-tape dl { grid-template-rows: repeat(4, minmax(76px, auto)); }
.bout-ticket-controls, .bout-document, .bout-doc-ruling, .bout-chain-reads, .bout-publication, .bout-print, .bout-footer { min-width: 0; }
.bc-select-trigger > span:first-child { white-space: normal; overflow: visible; text-overflow: clip; }
.bout-rule-row .bc-rule { grid-column: 2 / -1; min-width: 0; }
.lab-out > div { align-items: start; }
.lab-out dd { min-width: 0; }
.bout-footer a { display: inline-flex; align-items: center; min-height: 44px; }
.bout-print a, .bout-publication a:not(.bc-button), .bout-doc-ruling a:not(.bc-button) { display: inline-flex; align-items: center; min-height: 44px; }
#boutPause[hidden] { display: none; }
.is-still .bout-fallback-note[hidden] { display: none; }
.bc-toast { bottom: max(24px, env(safe-area-inset-bottom)); }

@media (min-width: 1440px) {
  .bout-nav__light, .bout-nav__dark { gap: 36px; }
  .bout-nav__light { padding-right: 120px; }
  .bout-nav__dark { padding-left: 120px; }
  .bout-wallet-slot { right: 40px; }
}
@media (min-width: 768px) and (max-width: 1023px) {
  :root { --bout-nav-space: 120px; }
  .bout-nav__light, .bout-nav__dark { padding: 64px 24px 12px; gap: 24px; align-items: center; }
  .bout-nav__light { justify-content: flex-end; }
  .bout-nav__dark { justify-content: flex-start; }
  .bout-wordmark { bottom: auto; height: 64px; }
  .bout-wallet-slot { top: 10px; bottom: auto; right: 20px; }
  .bout-nav.is-condensed::before { transform: scaleY(.88); }
  .bout-ticket-controls { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .bout-step { max-width: none; }
  .bout-tape { column-gap: 44%; }
  .bout-tape h2 { font-size: 22px; }
  .bout-tape dt { font-size: 12px; }
  .bout-tape .bc-number { font-size: 16px; }
  .bout-tape dl { grid-template-rows: repeat(4, minmax(92px, auto)); }
  .bout-tape__corner { gap: 8px; }
  .bout-judges__readings { gap: 0; }
  .bout-judge .bc-readout { white-space: normal; }
}
@media (min-width: 1024px) {
  .bout-menu-toggle.bc-button { display: none; }
  .bout-ticket-controls { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
}
@media (min-width: 1024px) and (max-width: 1279px) {
  .bc-quick { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .bc-quick .bc-button:last-child { grid-column: 1 / -1; }
}
@media (max-width: 767px) {
  :root { --bout-nav-space: calc(72px + env(safe-area-inset-top)); --bout-inset: 20px; }
  .bout-nav { grid-template-columns: 1fr auto; padding: env(safe-area-inset-top) 16px 0; }
  .bout-nav::before { background: var(--card); }
  .bout-nav__light, .bout-nav__dark { display: none; }
  .bout-wordmark { left: 0; width: 124px; height: 72px; font-size: 28px; transform: translateY(var(--bout-nav-lift)); }
  .bout-wordmark__half--light { color: var(--ink); }
  .bout-menu-toggle.bc-button { display: block; top: calc(12px + env(safe-area-inset-top)); right: 16px; width: 44px; height: 44px; min-width: 44px; min-height: 44px; padding: 0; color: var(--ink); transform: translateY(var(--bout-nav-lift)); transition: transform 260ms var(--bc-ease); }
  .bout-nav-sheet { grid-template-rows: auto 1fr auto; align-content: stretch; }
  .bout-nav-indicator { display: none; }
  .bout-nav-current { display: none; }
  .bout-nav-sheet .bout-nav-indicator { position: absolute; }
  .bout-nav a:focus-visible { outline-color: currentColor !important; }

  .bout-arena__heading { padding-inline: 16px; }
  .bout-arena h1 { font-size: clamp(30px, 8vw, 52px); }
  .bout-crossing { grid-area: 2/1; height: 392px; min-height: 392px; }
  .bout-tape__corner--A { grid-row: 3; }

  .bout-blades { inset: 0 12px; }
  .bout-blades .object-still { object-fit: cover; }

  .bout-tape__corner { grid-template-rows: auto auto auto auto auto; padding: 28px 20px; text-align: left; }
  .bout-tape dl { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; gap: 0; }
  .bout-tape dl > div, .bout-tape__corner--B dl > div { padding-block: 16px; border-bottom: 1px solid var(--line); justify-items: start; text-align: left; gap: 6px; }
  .bout-tape__corner--B dl > div { border-color: var(--ink-soft); }
  .bout-tape dd { display: block; width: 100%; }
  .bout-tape .bc-number { font-size: 22px; text-align: left; }
  .bout-tape .bc-tape-meaning { font-size: 14px; }
  .bout-arena__foot .btn { width: 100%; justify-content: space-between; }
  .bout-ticket-controls { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .bout-step > .bc-select-wrap, .bout-step select, .bout-step .bc-amount { width: 100%; }
  .bc-ticket-results { border: 0; }
  .bc-ticket-results > * { padding: 24px 0; }
  .bc-ticket-results .bout-outcomes { background: transparent; }
  .bc-ticket-stub { border-left: 0; }
  .lab-actions { display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; }
  .lab-actions .bc-button { width: 100%; justify-content: space-between; }
  .bc-quick { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .bc-quick .bc-button { font-size: 12px; padding: 12px 4px; gap: 4px; }
  .bc-amount__head { flex-wrap: wrap; }
  .bout-side-choices .bout-side { font-size: 14px; }
  .bout-round-clock { grid-template-columns: minmax(0, 1fr); justify-items: start; padding: 24px 0; }
  .bout-round-clock > *, .bout-round-clock #fightClock, .bout-round-clock .bc-clock-unit, .bout-round-clock .bc-clock-actions { grid-column: 1; grid-row: auto; text-align: left; }
  .bc-clock-actions { display: flex; flex-wrap: wrap; width: 100%; gap: 8px; }
  .bc-clock-actions .bc-button { flex: 1; padding-inline: 12px; }
  .bc-tabs .bc-button { font-size: 14px; padding: 12px 8px; }
  .bout-match__quote { white-space: normal; line-height: 1.6; }
  .bout-rule-row { grid-template-columns: 64px minmax(0, 1fr); gap: 16px; }
  .bout-rule-row .bout-diagram { width: 64px; height: 64px; }
  .bout-rule-row h3 { font-size: 24px; }
  .bout-doc-crossing img { height: 392px; min-height: 392px; object-fit: cover; }
  .bout-doc-crossing::before { display: none; }
  .bout-doc-crossing figcaption { background: var(--bout-steel); padding: 16px 20px; }
  .bout-doc-tape > div:last-child { text-align: left; }
  .bout-judges__readings { grid-template-columns: minmax(0, 1fr); }
  .bout-judge { padding: 24px 20px; text-align: left; gap: 12px; }
  .bout-judge .bc-readout { font-size: 24px; min-height: 0; white-space: normal; }
  .bout-call-stamp { justify-self: start; }
  .bout-state-steps .bc-button { font-size: 12px; padding-inline: 4px; }
  .lab-out > div, .bout-reserves > div { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .lab-out dd { text-align: left; }
  .stake-controls, .prestake__action { grid-template-columns: minmax(0, 1fr); }
  .stake-controls .bc-button { width: 100%; }
  .prestake__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 16px; }
  .bout-chain-reads dl { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .bout-chain-reads dd { text-align: left; margin-bottom: 16px; }
  .bout-board, .bout-board tbody, .bout-board tr { display: block; }
  .bout-board thead { position: absolute; width: 1px; height: 1px; clip-path: inset(50%); overflow: hidden; }
  .bout-board td { display: grid; grid-template-columns: minmax(0, 1fr); text-align: left; padding: 12px 0; }
  .bout-board td::before { content: attr(data-label); font: 400 12px/1.4 var(--font-body); color: var(--ink-soft); }
  .bout-board td[colspan]::before { content: none; }
  .bout-board tr { padding-block: 12px; border-bottom: 1px solid var(--line); }
  .bc-popover { width: min(300px, calc(100vw - 40px)); padding: 16px; }
  .bc-popover nav { flex-wrap: wrap; }
  .bc-dialog .wallet-picker__head { flex-wrap: wrap; gap: 12px; }
  .bc-dialog .wallet-picker__row { white-space: normal; }
}
@media (max-width: 390px) {
  .bout-sheet-links a[data-nav-key] { font-size: 28px; }
  .bout-print > div, .bout-publication > div { padding-inline: 20px; }
  .bout-cta-primary, .bout-cta-secondary { gap: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  html { scroll-behavior: auto; }
  .bout-sheet-half { transform: none; }
  .bout-sheet-links a[data-nav-key] { transform: none; opacity: 1; }
}