:root {
  --result-navy: oklch(27% 0.12 255);
  --result-navy-deep: oklch(20% 0.09 255);
  --result-blue: oklch(53% 0.15 245);
  --result-cyan: oklch(76% 0.12 215);
  --result-paper: oklch(96% 0.014 235);
  --result-white: oklch(99% 0.006 240);
  --result-line: oklch(76% 0.035 240);
  --result-ink: oklch(22% 0.04 255);
}

.result-page {
  max-width: none;
  overflow-x: hidden;
  color: var(--result-ink);
  background: oklch(92% 0.018 235);
}

.result-competition-hero {
  position: relative;
  min-height: 390px;
  padding: 18px 0 0;
  color: var(--result-white);
  background:
    linear-gradient(oklch(18% 0.09 255 / 0.45), oklch(18% 0.09 255 / 0.84)),
    url('../img/hero2.jpg') center / cover;
}

.result-breadcrumb {
  width: min(1180px, calc(100% - 32px));
  margin: 0 auto !important;
}

.result-breadcrumb .breadcrumb {
  margin: 0;
}

.result-hero-content {
  width: min(1180px, calc(100% - 32px));
  max-width: none;
  padding: 52px 0 0 !important;
}

.result-kicker {
  margin: 0 0 10px;
  color: var(--result-cyan);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.2em;
}

.result-hero-panel.card {
  position: static;
  inset: auto;
  width: 100%;
  margin: 0;
  border: 0;
  border-radius: 0;
  color: var(--result-white);
  background: transparent;
  box-shadow: none;
  transform: none;
}

.result-title-row {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 28px;
}

.result-event-title {
  max-width: 850px;
  margin: 0;
  font-size: clamp(1.55rem, 3vw, 2.7rem);
  line-height: 1.22;
  text-align: left;
}

.result-event-title small {
  display: inline-block;
  font-size: .55em;
  font-weight: 700;
  letter-spacing: 0;
  opacity: .82;
}

.result-event-title br + small {
  display: block;
  margin-top: .12em;
}

.result-confirmed {
  flex: 0 0 auto;
  margin-bottom: 8px;
  padding: 8px 10px;
  border: 1px solid var(--result-cyan);
  color: var(--result-white);
  font-size: 0.65rem;
  font-weight: 750;
  letter-spacing: 0.12em;
}

.penalty-label,
tr:has(.penalty-label) td,
tr:has(.penalty-label) td span {
  color: #d92d20 !important;
}

.result-confirmed--live {
  border-color: oklch(79% 0.16 150);
  color: oklch(90% 0.08 150);
}

.result-confirmed--waiting {
  border-color: oklch(78% 0.08 80);
  color: oklch(90% 0.06 80);
}

.result-total-tabs,
.result-apparatus-tabs {
  display: grid !important;
  width: 100%;
  margin: 28px 0 0 !important;
  padding: 0;
  background: var(--result-navy);
}

.result-total-tabs {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 32px !important;
  border-bottom: 1px solid oklch(46% 0.07 250);
}

.result-apparatus-tabs {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin-top: 0 !important;
  border-bottom: 3px solid var(--result-cyan);
}

.result-total-tabs > .form-check,
.result-apparatus-tabs > .form-check {
  width: auto !important;
  max-width: none;
  margin: 0 !important;
  padding: 0 !important;
}

.result-total-tabs .form-check-label,
.result-apparatus-tabs .form-check-label {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 48px;
  margin: 0;
  padding: 7px 5px;
  border-right: 1px solid oklch(46% 0.07 250);
  color: oklch(87% 0.025 240);
  cursor: pointer;
}

.result-total-tabs .form-check-label {
  min-height: 42px;
}

.result-total-tabs .form-check:last-child .form-check-label,
.result-apparatus-tabs .form-check:last-child .form-check-label {
  border-right: 0;
}

.result-apparatus-tabs .form-check-label {
  flex-direction: column;
  gap: 3px;
  font-size: 0.67rem;
  font-weight: 700;
}

.result-apparatus-tabs .form-check-label img {
  width: 28px !important;
  height: 28px;
  margin: 0 !important;
  object-fit: cover;
}

.result-total-tabs input.kindcheck:checked + label,
.result-apparatus-tabs input.kindcheck:checked + label {
  color: var(--result-navy);
  background: var(--result-cyan);
}

.result-apparatus-tabs input.kindcheck:checked + label {
  box-shadow: inset 0 -3px 0 var(--result-white);
}

.result-apparatus-tabs label::after {
  display: block;
  min-height: 1em;
  line-height: 1;
}

.result-page[data-game-type="1"][data-sex="1"] label[for="kind1"]::after { content: "ゆか"; }
.result-page[data-game-type="1"][data-sex="1"] label[for="kind2"]::after { content: "あん馬"; }
.result-page[data-game-type="1"][data-sex="1"] label[for="kind3"]::after { content: "つり輪"; }
.result-page[data-game-type="1"][data-sex="1"] label[for="kind4"]::after { content: "跳馬"; }
.result-page[data-game-type="1"][data-sex="1"] label[for="kind5"]::after { content: "平行棒"; }
.result-page[data-game-type="1"][data-sex="1"] label[for="kind6"]::after { content: "鉄棒"; }
.result-page[data-game-type="1"][data-sex="2"] label[for="kind1"]::after { content: "跳馬"; }
.result-page[data-game-type="1"][data-sex="2"] label[for="kind2"]::after { content: "段違い平行棒"; }
.result-page[data-game-type="1"][data-sex="2"] label[for="kind3"]::after { content: "平均台"; }
.result-page[data-game-type="1"][data-sex="2"] label[for="kind4"]::after { content: "ゆか"; }
.result-page[data-game-type="2"][data-sex="1"] label[for="kind1"]::after { content: "スティック"; }
.result-page[data-game-type="2"][data-sex="1"] label[for="kind2"]::after { content: "リング"; }
.result-page[data-game-type="2"][data-sex="1"] label[for="kind3"]::after { content: "ロープ"; }
.result-page[data-game-type="2"][data-sex="1"] label[for="kind4"]::after { content: "クラブ"; }
.result-page[data-game-type="2"] label[for="kind5"]::after { content: "◇ 団体"; }
.result-page[data-game-type="2"][data-sex="2"] label[for="kind1"]::after { content: "フープ"; }
.result-page[data-game-type="2"][data-sex="2"] label[for="kind2"]::after { content: "ボール"; }
.result-page[data-game-type="2"][data-sex="2"] label[for="kind3"]::after { content: "クラブ"; }
.result-page[data-game-type="2"][data-sex="2"] label[for="kind4"]::after { content: "リボン"; }
.result-page[data-game-type="2"] label[for="kind6"]::after,
.result-page[data-game-type="2"] label[for="kind7"]::after { content: "◇ 団体"; }
.result-page[data-game-type="2"] label[for="kind7"]::after { content: "徒手"; }

.result-meta-store {
  width: 100%;
  max-width: none;
  padding: 0;
}

.result-information {
  margin: 0;
  padding: 12px clamp(16px, 4vw, 48px);
  color: oklch(39% 0.035 80) !important;
  font-size: 0.78rem;
  text-align: left !important;
  background: oklch(93% 0.035 85);
}

.result-information::before {
  content: "INFORMATION";
  margin-right: 18px;
  color: oklch(46% 0.11 75);
  font-size: 0.67rem;
  font-weight: 850;
  letter-spacing: 0.14em;
}

.result-shell {
  width: min(1180px, calc(100% - 28px));
  margin: clamp(36px, 6vw, 72px) auto 72px;
}

.result-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  padding: 14px 4px 16px;
  border-top: 3px solid var(--result-navy);
}

.result-section-kicker {
  display: block;
  margin: 0 0 5px 8px;
  color: var(--result-blue);
  font-size: 0.67rem;
  font-weight: 800;
  letter-spacing: 0.18em;
}

.result-section-heading .arrow-box {
  margin-left: 0 !important;
  padding: 0;
  color: var(--result-ink);
  font-size: clamp(1.4rem, 3vw, 2rem);
  line-height: 1.2;
  background: transparent;
}

.result-event-title.is-three-lines {
  font-size: clamp(1.2rem, 4.6vw, 2.05rem);
}

#result-category-title.is-two-lines {
  font-size: clamp(1.2rem, 4.8vw, 1.65rem);
}

.result-update {
  color: oklch(44% 0.03 250);
  white-space: nowrap;
}

.result-scoreboard.card {
  margin: 0 !important;
  padding-bottom: 0 !important;
  overflow: hidden;
  border: 1px solid var(--result-line) !important;
  border-radius: 0;
  background: var(--result-white);
  box-shadow: none;
}

.result-scoreboard-header {
  min-height: 56px;
  padding: 10px 14px;
  border: 0;
  border-bottom: 1px solid var(--result-line);
  background: var(--result-white);
}

.result-scoreboard .res-title {
  color: var(--result-navy);
  font-size: 1rem;
  letter-spacing: 0.05em;
}

.result-scoreboard .result-body {
  background: oklch(92% 0.04 240);
}

.result-scoreboard .result-table thead {
  color: var(--result-white);
  background: var(--result-navy);
}

.result-scoreboard .card-body,
.result-scoreboard .table-responsive {
  min-width: 0;
}

/* Result rows are generated by the existing script.  Keep their structure,
   but give the desktop table a deliberate scoreboard rhythm. */
.result-scoreboard #table-kind8tb {
  margin: 0;
  color: var(--result-white);
  background: var(--result-navy);
}

.result-scoreboard #table-kind8tb th {
  padding: 10px 12px;
  border: 0;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  white-space: nowrap;
}

.result-scoreboard #kind8-result > [id^="res-hed-"] {
  border-bottom: 1px solid var(--result-line) !important;
}

.result-scoreboard #kind8-result > [id^="res-hed-"] > table,
.result-scoreboard #kind8-result > [id^="res-data-"] table {
  width: 100%;
  margin: 0;
}

.result-scoreboard #kind8-result tr.secList {
  cursor: pointer;
  transition: background-color 160ms ease;
}

.result-scoreboard #kind8-result tr.secList:hover {
  background: oklch(96% 0.02 235);
}

.result-scoreboard #kind8-result tr.secList > th,
.result-scoreboard #kind8-result tr.secList > td {
  padding: 15px 12px;
  border: 0;
  vertical-align: middle;
}

.result-scoreboard #kind8-result tr.secList > th {
  color: oklch(42% 0.12 250);
  font-size: 1.08rem;
  font-variant-numeric: tabular-nums;
}

.result-scoreboard #kind8-result .total-td {
  color: var(--result-navy);
  font-size: 1.18rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.result-scoreboard #kind8-result [id^="res-data-"] {
  margin: 0 !important;
  padding: 0 14px 14px;
  overflow-x: auto;
  background: oklch(96% 0.02 235);
  contain: inline-size paint;
}

.result-scoreboard #kind8-result [id^="res-data-"] table {
  min-width: 620px;
}

.result-scoreboard #kind8-result [id^="res-data-"] th,
.result-scoreboard #kind8-result [id^="res-data-"] td {
  padding: 9px 8px;
  white-space: nowrap;
}

@media (max-width: 767.98px) {
  .result-competition-hero {
    min-height: 0;
    padding-top: 14px;
  }

  .result-hero-content {
    width: 100%;
    padding-top: 38px !important;
  }

  .result-kicker,
  .result-title-row {
    margin-inline: 16px;
  }

  .result-title-row {
    display: block;
  }

  .result-event-title {
    font-size: clamp(1.35rem, 6vw, 1.85rem);
  }

  .result-confirmed {
    display: inline-block;
    margin-top: 16px;
  }

  .result-apparatus-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .result-apparatus-tabs .form-check-label {
    border-top: 1px solid oklch(46% 0.07 250);
  }

  .result-shell {
    width: calc(100% - 8px);
    margin-top: 36px;
  }

  .result-section-heading {
    align-items: flex-start;
    padding-inline: 12px;
  }

  .result-section-heading .arrow-box {
    font-size: 1.45rem;
  }

  .result-update {
    padding-top: 5px;
    font-size: 0.7rem;
  }

  .result-scoreboard-header {
    padding-inline: 10px;
  }

  /* Mobile prioritizes rank, athlete and total. Club/age remain in the row;
     the original desktop-only cells are merely hidden, not removed. */
  .result-scoreboard #table-kind8tb {
    display: none;
  }

  .result-scoreboard #kind8-result > [id^="res-hed-"] > table,
  .result-scoreboard #kind8-result > [id^="res-hed-"] > table > tbody {
    display: block;
  }

  .result-scoreboard #kind8-result tr.secList {
    display: grid;
    grid-template-columns: 34px 30px minmax(0, 1fr) auto 18px;
    align-items: start;
    column-gap: 5px;
    min-height: 62px;
    padding: 8px;
  }

  .result-scoreboard #kind8-result tr.secList > th,
  .result-scoreboard #kind8-result tr.secList > td {
    display: block;
    width: auto !important;
    min-width: 0;
    padding: 0;
    border: 0;
  }

  .result-scoreboard #kind8-result tr.secList > :nth-child(1) {
    grid-column: 1;
    grid-row: 1 / span 2;
    padding-top: 2px;
    font-size: 1rem;
  }

  .result-scoreboard #kind8-result tr.secList > :nth-child(2) {
    grid-column: 2;
    grid-row: 1 / span 2;
    padding-top: 4px;
    color: oklch(47% 0.03 250);
    font-size: 0.72rem;
    font-variant-numeric: tabular-nums;
  }

  .result-scoreboard #kind8-result tr.secList > :nth-child(3) {
    grid-column: 3;
    grid-row: 1 / span 2;
    color: var(--result-navy);
    font-size: 0.96rem;
    font-weight: 750;
    line-height: 1.35;
    white-space: normal;
  }

  .result-scoreboard #kind8-result tr.secList > :nth-child(4),
  .result-scoreboard #kind8-result tr.secList > :nth-child(5) {
    display: none;
  }

  .result-scoreboard #kind8-result tr.secList > :nth-child(6) {
    grid-column: 4;
    grid-row: 1;
    padding-top: 2px;
    font-size: 1.05rem;
    line-height: 1.2;
  }

  .result-scoreboard #kind8-result tr.secList > :nth-child(7) {
    grid-column: 5;
    grid-row: 1;
    padding-top: 2px;
  }

  .result-scoreboard #kind8-result tr.secList > :nth-child(3) > br {
    display: none;
  }

  .result-scoreboard #kind8-result tr.secList [id^="age-sub-"] {
    display: inline !important;
    margin-left: 4px;
    color: oklch(47% 0.03 250);
    font-size: 0.75rem;
    font-weight: 500;
  }

  .result-scoreboard #kind8-result tr.secList [id^="club-sub-"] {
    display: block !important;
    margin-top: 3px;
    color: oklch(47% 0.03 250);
    font-size: 0.72rem;
    font-weight: 500;
  }

  .result-scoreboard #kind8-result [id^="res-data-"] {
    padding: 0 8px 10px;
  }

  .result-scoreboard #kind8-result [id^="res-data-"] table {
    width: max-content;
    min-width: 100%;
  }

  /* A single-event breakdown has only three columns. Keep it in view rather
     than forcing the horizontal scorecard treatment used by all-around data. */
  .result-scoreboard #kind8-result [id^="res-data-"]:not(:has(table tr > :nth-child(4))) table {
    width: 100%;
    min-width: 100%;
    table-layout: fixed;
  }

  .result-scoreboard #kind8-result [id^="res-data-"]:not(:has(table tr > :nth-child(4))) th,
  .result-scoreboard #kind8-result [id^="res-data-"]:not(:has(table tr > :nth-child(4))) td {
    white-space: normal;
  }

  .result-scoreboard #kind8-result [id^="res-data-"]:has(table tr > :nth-child(7)):not(:has(table tr > :nth-child(8))) th,
  .result-scoreboard #kind8-result [id^="res-data-"]:has(table tr > :nth-child(7)):not(:has(table tr > :nth-child(8))) td {
    padding-inline: 3px;
  }

  /* Team summary rows have Rank / Bib / Club / Total / disclosure.
     They do not include the individual row's separate club and age cells. */
  .result-scoreboard #kind8-result tr.secList:not(:has(> :nth-child(7))) > :nth-child(4) {
    display: block;
    grid-column: 4;
    grid-row: 1;
    padding-top: 2px;
    font-size: 1.05rem;
    line-height: 1.2;
  }

  .result-scoreboard #kind8-result tr.secList:not(:has(> :nth-child(7))) > :nth-child(5) {
    display: block;
    grid-column: 5;
    grid-row: 1;
    padding-top: 2px;
  }

  /* Team breakdowns contain six apparatuses plus a total. Give each score
     a legible column width and keep the athlete name visible while scrolling. */
  .result-scoreboard #kind8-result [id^="res-data-"]:has(table tr > :nth-child(8)) table {
    min-width: 680px;
  }

  .result-scoreboard #kind8-result [id^="res-data-"]:has(table tr > :nth-child(8)) tr > :first-child {
    position: sticky;
    left: 0;
    z-index: 1;
    width: 58px;
    min-width: 58px;
    max-width: 58px;
    padding-inline: 5px;
    background: color-mix(in oklab, transparent 82%, oklch(89% 0.045 245));
    font-size: 0.74rem;
    line-height: 1.25;
    white-space: normal;
  }

  .result-scoreboard #kind8-result [id^="res-data-"]:has(table tr > :nth-child(8)) tr > :last-child {
    min-width: 82px;
    padding-right: 22px;
  }

  .result-scoreboard #kind8-result [id^="res-data-"]:has(table tr > :nth-child(4)) tbody tr > :not(:first-child) {
    border-left: 1px solid oklch(65% 0.045 245 / 0.42);
  }


  .result-scoreboard #kind8-result [id^="res-data-"]:has(table tr > :nth-child(8)) tbody tr > :not(:first-child) .row {
    display: flex;
    flex-wrap: nowrap;
    align-items: baseline;
    justify-content: center;
    gap: 3px;
    margin: 0;
  }

  .result-scoreboard #kind8-result [id^="res-data-"]:has(table tr > :nth-child(8)) tbody tr > :not(:first-child) .row > [class*="col-"] {
    flex: 0 0 auto;
    width: auto;
    max-width: none;
    padding: 0;
  }

  .result-scoreboard #kind8-result [id^="res-data-"]:has(table tr > :nth-child(8)) tbody tr > :not(:first-child) .row .font-small {
    color: oklch(46% 0.035 245);
    font-size: 0.64rem;
  }
}

@media (max-width: 420px) {
  .result-information {
    padding-inline: 12px;
    font-size: 0.7rem;
  }

  .result-information::before {
    display: block;
    margin: 0 0 4px;
  }

  .result-scoreboard-header > div {
    gap: 5px;
  }

  .result-scoreboard-header .onoffswitch {
    margin-right: 4px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .result-page * {
    transition: none !important;
  }
}