:root {
  --green: #a74406;
  --green2: #934006;
  --lime: #ffd092;
  --cream: #f8f3eb;
  --ink: #29211b;
  --muted: #796b60;
  --line: #e7dace;
  --shadow: 0 12px 30px rgba(59, 37, 20, .10);
}

header {
  height: 132px;
  background: linear-gradient(135deg, #171411 0%, #35271c 100%);
  border-bottom: 3px solid #ff8700;
}

.brand {
  display: flex;
  align-items: center;
  gap: 14px;
}

.brand img {
  width: 76px;
  height: 76px;
  object-fit: contain;
  border-radius: 50%;
  box-shadow: 0 7px 20px rgba(19, 13, 8, .28);
}

.brand h1 {
  margin: 1px 0 0;
}

.brand h1 b {
  color: #ffbd66;
}

.event-name {
  display: block;
  margin-top: 1px;
  color: #e8c6a0;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1.8px;
}

.edition {
  display: block;
  margin-top: -2px;
  color: #fff;
  font-size: 11px;
  font-weight: 750;
  letter-spacing: .4px;
}

.eyebrow {
  color: #e8c6a0;
}

.auth {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .48);
}

nav {
  border: 1px solid rgba(59, 37, 20, .08);
}

.tab.active,
.primary {
  background: #a74406;
}

.rank.top {
  background: #ffe0b4;
  color: #a74406;
}

.pill {
  background: #ffead3;
  color: #8b3c08;
}

.points,
.winner,
.ghost {
  color: #934006;
}

.score {
  background: #fcf0e3;
}

.team-with-crest,
.admin-match {
  display: inline-flex;
  align-items: center;
  gap: 9px;
}

.team-with-crest {
  gap: 18px;
}

.team-crest {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  object-fit: contain;
  border-radius: 99px;
  background: #fff;
  border: 1px solid #e7dace;
  padding: 2px;
}

img.team-crest {
  cursor: zoom-in;
  position: relative;
  z-index: 1;
  transform: scale(1.66);
  transition: transform .15s ease, box-shadow .15s ease;
}

img.team-crest:hover {
  z-index: 2;
  transform: scale(1.82);
  box-shadow: 0 4px 12px rgba(59, 37, 20, .2);
}

.modal-open {
  overflow: hidden;
}

.crest-modal {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(20, 16, 12, .86);
  backdrop-filter: blur(5px);
}

.crest-modal-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  max-width: min(88vw, 500px);
  color: #fff;
  font-size: 18px;
  text-align: center;
}

.crest-modal-content img {
  display: block;
  width: min(76vw, 420px);
  height: min(76vw, 420px);
  object-fit: contain;
  padding: 12px;
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 22px 60px rgba(0, 0, 0, .4);
}

.crest-modal-close {
  position: absolute;
  top: max(18px, env(safe-area-inset-top));
  right: 18px;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(255, 255, 255, .5);
  border-radius: 50%;
  background: rgba(255, 255, 255, .12);
  color: #fff;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}

.crest-placeholder {
  display: inline-grid;
  place-items: center;
  background: #ffead3;
  color: #a74406;
  font-size: 14px;
  font-weight: 900;
}

.team-right {
  justify-content: flex-end;
}

.team-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

.crest-button {
  margin: 0;
  padding: 7px 9px;
  border: 1px solid #e2bc98;
  border-radius: 8px;
  color: #934006;
  background: #fff4e7;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}

.admin-match .team-crest {
  width: 26px;
  height: 26px;
  flex-basis: 26px;
}

.card,
.table-card,
.game-card {
  border-color: #eaded2;
}

.football-mode table {
  min-width: 790px;
}

.sport-settings {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto auto;
  align-items: center;
  gap: 18px;
  margin-bottom: 16px;
  padding: 16px 18px;
}

.sport-settings h3,
.sport-settings p {
  margin-bottom: 0;
}

.sport-settings p {
  margin-top: 3px;
  color: #796b60;
  font-size: 12px;
}

.sport-options {
  display: flex;
  gap: 7px;
}

.sport-options label {
  margin: 0;
  cursor: pointer;
}

.sport-options input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.sport-options span {
  display: block;
  padding: 10px 14px;
  border: 1px solid #e3cfba;
  border-radius: 10px;
  background: #fcf7f0;
  color: #796b60;
  font-weight: 800;
  transition: .15s ease;
}

.sport-options input:checked + span {
  border-color: #a74406;
  background: #ffead3;
  color: #a74406;
  box-shadow: inset 0 0 0 1px #a74406;
}

.sport-options input:focus-visible + span {
  outline: 3px solid rgba(167, 68, 6, .25);
  outline-offset: 2px;
}

.manage-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 13px;
}

.manage-card-head h3 {
  margin: 0;
}

.generator-controls {
  display: flex;
  align-items: flex-end;
  gap: 7px;
}

.generator-controls label {
  margin: 0;
  color: #796b60;
  font-size: 9px;
  letter-spacing: .3px;
  text-transform: uppercase;
}

.generator-controls input {
  width: 70px;
  margin-top: 3px;
  padding: 7px;
  color: #a74406;
  font-size: 12px;
  font-weight: 800;
  text-align: center;
}

.magic-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  border: 1px solid #e2bc98;
  border-radius: 9px;
  background: linear-gradient(135deg, #fff4e7, #ffead3);
  color: #934006;
  font-size: 11px;
  font-weight: 850;
  cursor: pointer;
}

.magic-button span {
  font-size: 16px;
}

.magic-button:hover {
  border-color: #934006;
  transform: translateY(-1px);
}

.magic-button:disabled {
  cursor: wait;
  opacity: .6;
  transform: none;
}

.schedule-intro {
  display: flex;
  align-items: center;
  gap: 13px;
  margin-bottom: 16px;
  padding: 14px 16px;
  border: 1px solid #e8c9a7;
  border-radius: 14px;
  background: linear-gradient(110deg, #ffead3, #fffaf3);
  color: #a74406;
}

.schedule-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 12px;
  background: #fff;
  font-size: 21px;
  box-shadow: 0 5px 14px rgba(59, 37, 20, .1);
}

.schedule-intro p {
  margin: 2px 0 0;
  color: #796b60;
  font-size: 13px;
}

.schedule-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.round-card {
  overflow: hidden;
  border: 1px solid #eaded2;
  border-radius: 16px;
  background: #fff;
  box-shadow: var(--shadow);
}

.round-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 15px;
  background: #a74406;
  color: #fff;
  text-transform: uppercase;
}

.round-head span {
  color: #ffe2bd;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1.3px;
}

.round-head strong {
  display: grid;
  place-items: center;
  min-width: 30px;
  height: 30px;
  max-width: 60%;
  padding: 0 9px;
  overflow: hidden;
  border-radius: 99px;
  background: #ffbd66;
  color: #a74406;
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.round-games {
  padding: 4px 14px;
}

.schedule-game {
  padding: 12px 0 14px;
}

.schedule-game + .schedule-game {
  border-top: 1px solid #f1e5d9;
}

.court {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 9px;
  color: #796b60;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .6px;
  text-transform: uppercase;
}

.schedule-status {
  margin-left: auto;
  padding: 2px 6px;
  border-radius: 99px;
  background: #fcf0e3;
  color: #796b60;
  font-size: 8px;
  letter-spacing: .3px;
}

.schedule-game-done .schedule-status {
  background: #ffead3;
  color: #934006;
}

.schedule-match {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 5px;
}

.schedule-team {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  color: #29211b;
  font-size: 12px;
}

.schedule-team strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.schedule-team-away {
  justify-content: flex-end;
  text-align: right;
}

.schedule-versus {
  color: #9b8069;
  font-size: 16px;
  font-weight: 900;
  text-align: center;
}

.schedule-score {
  min-width: 48px;
  padding: 4px 6px;
  border-radius: 8px;
  background: #a74406;
  color: #fff;
  font-size: 13px;
  white-space: nowrap;
}

.schedule-score-form {
  display: grid;
  grid-template-columns: 38px 12px 38px;
  align-items: center;
  justify-content: center;
  gap: 3px;
}

.schedule-score-form input {
  width: 38px;
  margin: 0;
  padding: 6px 2px;
  border-radius: 7px;
  font-size: 14px;
  font-weight: 900;
  text-align: center;
}

.schedule-score-form b {
  color: #9b8069;
  text-align: center;
}

.schedule-score-form .primary {
  grid-column: 1 / -1;
  padding: 5px 8px;
  border-radius: 7px;
  font-size: 9px;
}

.schedule-print-score {
  display: none;
}

.schedule-winner {
  color: #934006;
}

.schedule-winner-label {
  margin-top: 7px;
  color: #934006;
  font-size: 10px;
  font-weight: 800;
  text-align: center;
}

.game-meta-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.game-meta-fields label {
  margin-top: 0;
}

.admin-game-info {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.admin-game-info small {
  color: #796b60;
  letter-spacing: .4px;
}

.admin-game-row {
  display: block;
}

.admin-game-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.game-meta-edit {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  align-items: end;
  gap: 7px;
  margin-top: 8px;
  padding: 8px;
  border-radius: 9px;
  background: #faf2e8;
}

.game-meta-edit label {
  margin: 0;
}

.game-meta-edit input {
  padding: 8px;
  font-size: 12px;
}

.game-meta-edit .ghost {
  padding: 8px 10px;
  background: #fff;
}

@media (max-width: 650px) {
  body {
    overflow-x: hidden;
  }

  header {
    height: 116px;
    min-width: 0;
  }

  .brand {
    gap: 10px;
    min-width: 0;
  }

  .brand > div {
    min-width: 0;
  }

  .brand img {
    width: 62px;
    height: 62px;
    border-radius: 50%;
  }

  .brand h1 {
    font-size: 22px;
  }

  .eyebrow {
    font-size: 8px;
  }

  .auth {
    padding: 8px 12px;
  }

  .tab {
    flex: 1 1 25%;
    gap: 3px;
    min-width: 0;
    padding-inline: 2px;
  }

  .tab span {
    overflow: hidden;
    max-width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .schedule-grid {
    grid-template-columns: 1fr;
    min-width: 0;
    width: 100%;
  }

  .round-card,
  .schedule-match {
    min-width: 0;
    width: 100%;
  }

  .schedule-team {
    gap: 10px;
    font-size: 11px;
  }

  .schedule-team .team-crest {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
  }

  .schedule-score-form {
    grid-template-columns: 34px 10px 34px;
  }

  .schedule-score-form input {
    width: 34px;
    padding-block: 5px;
    font-size: 13px;
  }

  .game-meta-fields {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .sport-settings {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .sport-options {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .sport-options span {
    text-align: center;
  }

  .manage-card-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .generator-controls {
    width: 100%;
  }

  .generator-controls label {
    flex: 1;
  }

  .generator-controls input {
    width: 100%;
  }

  .magic-button {
    flex: 0 0 auto;
  }

  .admin-game-row {
    gap: 8px;
  }

  .game-meta-edit {
    grid-template-columns: 1fr 1fr;
  }

  .game-meta-edit .ghost {
    grid-column: 1 / -1;
  }

  .team-admin-row {
    align-items: flex-start;
    gap: 8px;
  }

  .team-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .crest-button {
    text-align: center;
  }
}

@page {
  size: A4 landscape;
  margin: 8mm;
}

@media print {
  * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  body {
    overflow: visible;
    background: #fff;
  }

  header,
  nav,
  #toast,
  .crest-modal,
  .schedule-intro {
    display: none !important;
  }

  main {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
  }

  #schedule {
    padding: 0;
  }

  #schedule .section-title {
    margin-bottom: 6px;
  }

  #schedule .section-title h2 {
    margin: 0;
    font-size: 19px;
  }

  #schedule .section-title small {
    font-size: 8px;
  }

  #schedule .pill {
    padding: 3px 8px;
    font-size: 9px;
  }

  .schedule-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px 8px;
  }

  .round-card {
    break-inside: avoid;
    page-break-inside: avoid;
    border-radius: 9px;
    box-shadow: none;
  }

  .round-head {
    padding: 4px 9px;
  }

  .round-head span {
    font-size: 8px;
  }

  .round-head strong {
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    font-size: 11px;
  }

  .round-games {
    padding: 0 9px;
  }

  .schedule-game {
    break-inside: avoid;
    page-break-inside: avoid;
    padding: 5px 0 6px;
  }

  .court {
    margin-bottom: 3px;
    font-size: 7px;
  }

  .schedule-status {
    padding: 1px 4px;
    font-size: 6px;
  }

  .schedule-team {
    gap: 7px;
    font-size: 9px;
  }

  .schedule-team .team-crest {
    width: 23px;
    height: 23px;
    flex-basis: 23px;
  }

  .schedule-team img.team-crest {
    transform: scale(1.15);
    box-shadow: none;
  }

  .schedule-versus {
    font-size: 11px;
  }

  .schedule-score {
    min-width: 39px;
    padding: 2px 4px;
    font-size: 9px;
  }

  .schedule-score-form {
    display: none;
  }

  .schedule-print-score {
    display: inline-block;
  }

  .schedule-winner-label {
    margin-top: 3px;
    font-size: 7px;
  }
}

/* Tournament formats, groups and ordered tiebreakers. */
.sport-settings{grid-template-columns:1fr;gap:16px;padding:22px}.sport-options{flex-wrap:wrap}.sport-options label{flex:1;min-width:170px}.sport-options span{height:100%;font-size:14px}.sport-options small{display:block;margin-top:3px;font-size:10px;letter-spacing:0;text-transform:none;color:inherit;font-weight:500}.sport-settings>.primary{justify-self:start}.group-count-label{max-width:220px;margin-top:0}.group-assignments{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px 16px}.group-assignments label{margin:8px 0}.tiebreaker-list{list-style:none;margin:14px 0;padding:0;display:grid;gap:7px;max-width:650px}.tiebreaker-list li{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--line);border-radius:10px;padding:9px 12px;background:#fcf7f0}.tiebreaker-list b{color:var(--green);margin-right:10px}.tiebreaker-list li>div{display:flex;gap:5px}.tiebreaker-list button{width:34px;height:32px;border:1px solid #e3cfba;border-radius:7px;background:white;color:var(--green);font-weight:800;font-size:18px;cursor:pointer}.tiebreaker-list button:disabled{opacity:.25;cursor:default}.fixture-distribution{margin:8px 0 16px}.fixture-distribution label{margin:0}.fixture-distribution p{font-size:11px;color:var(--muted);margin:6px 0}.ranking-group{margin-bottom:24px}.ranking-group h3{margin:0 0 10px;color:var(--green)}#rankingTables table{min-width:880px}.score-field-title{grid-column:1/-1;text-align:center;font-size:9px;color:var(--muted);font-weight:700}.schedule-score-form .clear-score{grid-column:1/-1;font-size:9px;padding:4px;cursor:pointer}.schedule-sets{text-align:center;font-size:12px;color:var(--green);font-weight:700;margin-top:8px}.manage-card-head{flex-wrap:wrap}.generator-controls{margin-left:auto}.schedule-score-form{min-width:94px}.legend{line-height:1.8}
@media(max-width:650px){.sport-settings{padding:16px}.sport-options{display:grid;grid-template-columns:1fr}.sport-options label{min-width:0}.sport-options span{padding:12px}.generator-controls{width:100%;justify-content:space-between}.group-assignments{grid-template-columns:1fr 1fr}.schedule-score-form{min-width:80px}.tiebreaker-list li{padding:8px;font-size:12px}}
@media print{.ranking-group{break-inside:avoid}.schedule-sets{display:block}.fixture-distribution{display:none}}
