/* Preiswattn – app and backend module. Colours: shades of red: #990000 (deep), #b71c1c (accent), #c62828, rosé tints, warm neutrals, green for live. Scoped to .pw. */

.pw {
  --pw-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  /* Shades of red around #990000 */
  --pw-accent: #b71c1c;
  --pw-accent-600: #990000;
  --pw-accent-400: #e05252;
  --pw-accent-soft: #fbe8e8;
  --pw-on-accent: #ffffff;
  /* Green = live / running */
  --pw-live: #16803c;
  --pw-live-soft: #e6f4ea;
  --pw-danger: #b71c1c;
  --pw-danger-soft: #fbe8e8;
  /* Warm neutrals */
  --pw-ink: #990000;
  --pw-ink-2: #c62828;
  --pw-bg: #faf6f5;
  --pw-surface: #ffffff;
  --pw-surface-2: #fcf9f8;
  --pw-border: #efe4e3;
  --pw-text: #4a4141;
  --pw-muted: #8a7e7d;
  --pw-ink-soft: #f6eded;
  --pw-gold: #d4b86a;
  --pw-radius: 18px;
  --pw-radius-sm: 12px;
  --pw-shadow: 0 1px 2px rgba(153, 0, 0, .05), 0 8px 24px -14px rgba(153, 0, 0, .22);
  --pw-shadow-lg: 0 2px 4px rgba(153, 0, 0, .06), 0 20px 40px -20px rgba(153, 0, 0, .3);
  --pw-gradient: linear-gradient(135deg, #990000 0%, #b71c1c 55%, #c62828 100%);
  --pw-gradient-accent: #b71c1c;

  color: var(--pw-text);
  font-family: var(--pw-font);
  font-size: 16px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

@media (prefers-color-scheme: dark) {
  .pw--frontend {
    --pw-bg: #140d0d;
    --pw-surface: #1d1414;
    --pw-surface-2: #251a1a;
    --pw-border: #3a2a29;
    --pw-text: #f2eae9;
    --pw-muted: #b3a3a1;
    --pw-accent-soft: rgba(214, 69, 76, .22);
    --pw-accent-600: #f08b8f;
    --pw-live-soft: rgba(22, 128, 60, .22);
    --pw-danger-soft: rgba(214, 69, 76, .22);
    --pw-ink-soft: #2a1d1d;
    --pw-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 12px 32px -16px rgba(0, 0, 0, .8);
  }

  .pw--frontend a {
    color: #f08b8f;
  }
}

.pw *,
.pw *::before,
.pw *::after {
  box-sizing: border-box;
}

.pw a {
  color: var(--pw-accent-600);
}

.pw h1,
.pw h2,
.pw h3,
.pw h4 {
  margin: 0;
  color: inherit;
  font-family: inherit;
  letter-spacing: -.01em;
}

.pw p {
  margin: 0;
}

/* Full page (page setup active) */

body.pw-body {
  margin: 0;
  background: #faf6f5;
}

@media (prefers-color-scheme: dark) {
  body.pw-body {
    background: #140d0d;
  }
}

.pw--frontend {
  min-height: 100vh;
  background: var(--pw-bg);
}

/* App bar */

.pw-appbar {
  position: sticky;
  top: 0;
  z-index: 20;
  color: #fff;
  background: var(--pw-gradient);
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  box-shadow: 0 4px 16px -10px rgba(153, 0, 0, .6);
}

.pw-appbar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  max-width: 1200px;
  margin: 0 auto;
  padding: .7rem 1rem;
}

.pw-brand {
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  min-width: 0;
  color: #fff !important;
  text-decoration: none;
}

.pw-brand__logo {
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  box-shadow: 0 0 0 2px rgba(255, 255, 255, .15);
}

.pw-brand__text {
  display: flex;
  flex-direction: column;
  min-width: 0;
  line-height: 1.15;
}

.pw-brand__text strong {
  overflow: hidden;
  font-size: 1.15rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pw-brand__text small {
  color: rgba(255, 255, 255, .65);
  font-size: .72rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.pw-user {
  display: flex;
  align-items: center;
  gap: .6rem;
}

.pw-user__avatar {
  display: inline-grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .14);
  color: #fff;
  font-weight: 700;
  text-transform: uppercase;
}

.pw-user__name {
  display: flex;
  flex-direction: column;
  max-width: 14rem;
  font-size: .9rem;
  font-weight: 650;
  line-height: 1.2;
}

.pw-user__name small {
  color: rgba(255, 255, 255, .6);
  font-size: .72rem;
  font-weight: 500;
}

.pw-iconbtn {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 12px;
  background: rgba(255, 255, 255, .08);
  color: #fff;
  cursor: pointer;
  transition: background .15s;
}

.pw-iconbtn:hover {
  background: var(--pw-accent);
  border-color: var(--pw-accent);
  color: var(--pw-on-accent);
}

.pw-logout {
  margin: 0;
}

/* Layout */

.pw-main {
  max-width: 1200px;
  margin: 0 auto;
  padding: 1.5rem 1rem 3rem;
}

.pw--backend .pw-main {
  max-width: none;
  padding: 0;
}

.pw-footer {
  padding: 0 1rem 2rem;
  color: var(--pw-muted);
  font-size: .8rem;
  text-align: center;
}

.pw-stack > * + * {
  margin-top: 1.25rem;
}

.pw-grid-2 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
  gap: 1.25rem;
  align-items: start;
}

.pw-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
}

.pw-muted {
  color: var(--pw-muted);
}

.pw-small {
  font-size: .875rem;
}

.pw-mt {
  margin-top: 1rem !important;
}

.pw-section-title {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-bottom: .75rem !important;
  color: var(--pw-muted);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.pw-section-title::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--pw-border);
}

/* Backend module head */

.pw-module-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.1rem 1.25rem;
  margin-bottom: 1.25rem;
  border-bottom: 0;
  border-radius: var(--pw-radius);
  color: #fff;
  background: var(--pw-gradient);
  box-shadow: var(--pw-shadow);
}

/* Page head with tabs */

.pw-pagehead {
  margin-bottom: 1.5rem;
}

.pw-back {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  margin-bottom: .5rem;
  color: var(--pw-muted) !important;
  font-size: .875rem;
  font-weight: 600;
  text-decoration: none;
}

.pw-back:hover {
  color: var(--pw-accent) !important;
}

.pw-title {
  font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.2rem);
  font-weight: 850;
  line-height: 1.12;
}

.pw-subtitle {
  font-size: 1.15rem;
  font-weight: 750;
}

.pw-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-top: .6rem;
}

.pw-tabs {
  display: flex;
  gap: .35rem;
  margin-top: 1.1rem;
  padding: .35rem;
  overflow-x: auto;
  border: 1px solid var(--pw-border);
  border-radius: 999px;
  background: var(--pw-surface);
  box-shadow: var(--pw-shadow);
  scrollbar-width: none;
}

.pw-tabs::-webkit-scrollbar {
  display: none;
}

.pw-tab {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .55rem 1rem;
  border-radius: 999px;
  color: var(--pw-muted) !important;
  font-size: .925rem;
  font-weight: 650;
  text-decoration: none;
  white-space: nowrap;
  transition: background .15s, color .15s;
}

.pw-tab:hover {
  background: var(--pw-surface-2);
  color: var(--pw-text) !important;
}

.pw-tab.is-active {
  background: var(--pw-accent);
  color: #fff !important;
  box-shadow: none;
}

.pw-tab svg {
  width: 18px;
  height: 18px;
}

/* Cards */

.pw-card {
  padding: 1.35rem;
  border: 1px solid var(--pw-border);
  border-radius: var(--pw-radius);
  background: var(--pw-surface);
  box-shadow: var(--pw-shadow);
}

.pw-card__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin-bottom: 1rem;
}

.pw-card--accent {
  border-top: 4px solid var(--pw-accent);
}

.pw-card--dark {
  border: 0;
  color: #fff;
  background: var(--pw-gradient);
}

.pw-card--danger {
  border-color: var(--pw-danger-soft);
}

.pw-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .9rem;
  padding: 2.5rem 1.5rem;
  text-align: center;
}

.pw-empty__icon {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border-radius: 20px;
  background: var(--pw-accent-soft);
  color: var(--pw-accent);
}

/* Messages */

.pw-messages {
  display: grid;
  gap: .6rem;
  margin-bottom: 1.25rem;
}

.pw-message {
  display: flex;
  align-items: flex-start;
  gap: .65rem;
  padding: .85rem 1rem;
  border: 1px solid var(--pw-border);
  border-left: 4px solid var(--pw-ink);
  border-radius: var(--pw-radius-sm);
  background: var(--pw-surface);
  box-shadow: var(--pw-shadow);
  font-weight: 550;
  animation: pw-slide-in .25s ease-out;
}

.pw-message--danger,
.pw-message--warning {
  border-left-color: var(--pw-danger);
}

.pw-message--info,
.pw-message--notice {
  border-left-color: var(--pw-muted);
}

@keyframes pw-slide-in {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
}

/* Buttons */

.pw-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  min-height: 44px;
  padding: .6rem 1.15rem;
  border: 1px solid var(--pw-border);
  border-radius: 12px;
  background: var(--pw-surface);
  color: var(--pw-text) !important;
  font: inherit;
  font-weight: 650;
  line-height: 1.2;
  text-decoration: none !important;
  cursor: pointer;
  transition: transform .12s, box-shadow .15s, background .15s, border-color .15s;
}

.pw-btn:hover {
  border-color: var(--pw-ink);
}

.pw-btn:active {
  transform: translateY(1px);
}

.pw-btn svg {
  width: 18px;
  height: 18px;
}

.pw-btn--primary {
  border-color: transparent;
  background: var(--pw-gradient-accent);
  color: var(--pw-on-accent) !important;
  box-shadow: 0 6px 14px -8px rgba(183, 28, 28, .7);
}

.pw-btn--primary:hover {
  border-color: transparent;
  background: var(--pw-accent-600);
  box-shadow: 0 8px 18px -8px rgba(183, 28, 28, .8);
}

.pw-btn--dark {
  border-color: transparent;
  background: var(--pw-ink);
  color: #fff !important;
}

.pw-btn--light {
  border-color: rgba(255, 255, 255, .3);
  background: rgba(255, 255, 255, .1);
  color: #fff !important;
}

.pw-btn--light:hover {
  border-color: var(--pw-accent);
  background: var(--pw-accent);
  color: var(--pw-on-accent) !important;
}

.pw-btn--ghost {
  border-color: transparent;
  background: var(--pw-surface-2);
}

.pw-btn--danger {
  border-color: var(--pw-danger);
  background: transparent;
  color: var(--pw-danger) !important;
}

.pw-btn--danger:hover {
  background: var(--pw-danger);
  color: #fff !important;
}

.pw-btn--sm {
  min-height: 34px;
  padding: .35rem .75rem;
  border-radius: 10px;
  font-size: .85rem;
}

.pw-btn--lg {
  min-height: 52px;
  padding: .8rem 1.5rem;
  font-size: 1.05rem;
}

.pw-btn--block {
  width: 100%;
}

.pw-inline-form {
  display: inline;
  margin: 0;
}

/* Badges & chips */

.pw-badge {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .28rem .7rem;
  border-radius: 999px;
  background: var(--pw-surface-2);
  color: var(--pw-muted);
  font-size: .8rem;
  font-weight: 700;
  white-space: nowrap;
}

.pw-badge svg {
  width: 14px;
  height: 14px;
}

.pw-badge--live {
  background: var(--pw-live-soft);
  color: var(--pw-live);
}

.pw-badge--live::before {
  content: "";
  width: .5rem;
  height: .5rem;
  border-radius: 50%;
  background: currentColor;
  animation: pw-pulse 1.4s ease-in-out infinite;
}

.pw-badge--done {
  background: var(--pw-ink);
  color: #fff;
}

.pw-badge--next {
  border: 1px dashed var(--pw-border);
  background: transparent;
}

.pw-badge--plain {
  border: 1px solid var(--pw-border);
  background: var(--pw-surface);
}

@keyframes pw-pulse {
  50% {
    opacity: .25;
  }
}

.pw-num-chip {
  display: inline-grid;
  place-items: center;
  min-width: 2rem;
  height: 2rem;
  padding: 0 .4rem;
  border-radius: 10px;
  background: var(--pw-ink);
  color: #fff;
  font-size: .9rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.pw-delta {
  display: inline-block;
  min-width: 3.2rem;
  padding: .25rem .55rem;
  border-radius: 8px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  text-align: center;
}

.pw-delta--up {
  background: var(--pw-ink-soft);
  color: var(--pw-text);
}

.pw-delta--down {
  background: var(--pw-danger-soft);
  color: var(--pw-danger);
}

.pw-delta--zero {
  background: var(--pw-surface-2);
  color: var(--pw-muted);
}

/* Live status */

.pw-live-status {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .35rem .8rem;
  border: 1px solid var(--pw-border);
  border-radius: 999px;
  background: var(--pw-surface);
  color: var(--pw-muted);
  font-size: .8rem;
  font-weight: 650;
}

.pw-live-status__dot {
  width: .55rem;
  height: .55rem;
  border-radius: 50%;
  background: var(--pw-live);
  box-shadow: 0 0 0 0 rgba(22, 128, 60, .6);
  animation: pw-ping 2s infinite;
}

.pw-live-flash {
  animation: pw-flash 1.2s ease-out;
}

@keyframes pw-ping {
  70% {
    box-shadow: 0 0 0 8px rgba(22, 128, 60, 0);
  }
}

@keyframes pw-flash {
  from {
    box-shadow: 0 0 0 3px var(--pw-accent);
  }
}

/* Round tiles (dashboard) */

.pw-roundtiles {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr));
  gap: 1rem;
}

.pw-roundtile {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: .35rem;
  padding: 1.1rem 1.2rem 1.2rem;
  overflow: hidden;
  border: 1px solid var(--pw-border);
  border-radius: var(--pw-radius);
  background: var(--pw-surface);
  box-shadow: var(--pw-shadow);
}

.pw-roundtile__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
}

.pw-roundtile__label {
  font-size: 1.15rem;
  font-weight: 850;
}

.pw-roundtile__value {
  font-size: 2rem;
  font-weight: 900;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}

.pw-roundtile__value small {
  color: var(--pw-muted);
  font-size: .9rem;
  font-weight: 600;
}

.pw-roundtile.is-live {
  border-color: rgba(22, 128, 60, .45);
  box-shadow: 0 0 0 3px var(--pw-live-soft), var(--pw-shadow);
}

.pw-roundtile.is-done {
  border: 0;
  color: #fff;
  background: var(--pw-gradient);
}

.pw-roundtile.is-done .pw-roundtile__value small,
.pw-roundtile.is-done .pw-muted {
  color: rgba(255, 255, 255, .7);
}

.pw-roundtile.is-upcoming {
  background: var(--pw-surface-2);
  box-shadow: none;
}

.pw-roundtile.is-upcoming .pw-roundtile__value {
  color: var(--pw-muted);
}

/* Facts (pairs, scoring) */

.pw-facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
  gap: 1rem;
}

.pw-fact {
  display: flex;
  align-items: center;
  gap: .9rem;
  padding: 1rem 1.15rem;
  border: 1px solid var(--pw-border);
  border-radius: var(--pw-radius);
  background: var(--pw-surface);
  box-shadow: var(--pw-shadow);
}

.pw-fact__icon {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 14px;
  background: var(--pw-accent-soft);
  color: var(--pw-accent);
}

.pw-fact__icon--dark {
  background: var(--pw-ink);
  color: #fff;
}

.pw-fact__icon svg {
  width: 22px;
  height: 22px;
}

.pw-fact__label {
  display: block;
  color: var(--pw-muted);
  font-size: .75rem;
  font-weight: 750;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.pw-fact__value {
  display: block;
  font-size: 1.35rem;
  font-weight: 850;
  line-height: 1.2;
}

.pw-fact__hint {
  display: block;
  color: var(--pw-muted);
  font-size: .82rem;
}

/* Dashboard grid */

.pw-dash-grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: 1.25rem;
  align-items: start;
}

@media (max-width: 980px) {
  .pw-dash-grid {
    grid-template-columns: 1fr;
  }
}

/* Podium */

.pw-podium {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  align-items: end;
  gap: .75rem;
  padding-top: .75rem;
}

.pw-podium__place {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .4rem;
  min-width: 0;
  text-align: center;
}

.pw-podium__place--1 {
  order: 2;
}

.pw-podium__place--2 {
  order: 1;
}

.pw-podium__place--3 {
  order: 3;
}

.pw-podium__medal {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  color: #4a4141;
  font-size: 1.2rem;
  font-weight: 900;
  box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .15), 0 6px 14px -6px rgba(0, 0, 0, .5);
}

.pw-podium__place--1 .pw-podium__medal {
  width: 58px;
  height: 58px;
  background: #dcc283;
}

.pw-podium__place--2 .pw-podium__medal {
  background: #d6d0ce;
}

.pw-podium__place--3 .pw-podium__medal {
  background: #d8ab86;
}

.pw-podium__name {
  max-width: 100%;
  font-size: .9rem;
  font-weight: 800;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.pw-podium__name span {
  display: block;
  color: var(--pw-muted);
  font-size: .78rem;
  font-weight: 650;
}

.pw-podium__points {
  font-size: .85rem;
  font-variant-numeric: tabular-nums;
}

.pw-podium__points strong {
  font-size: 1.1rem;
}

.pw-podium__block {
  width: 100%;
  border-radius: 14px 14px 0 0;
  color: rgba(255, 255, 255, .92);
  font-size: 1.6rem;
  font-weight: 900;
  line-height: 1;
  padding-top: .8rem;
}

.pw-podium__place--1 .pw-podium__block {
  height: 112px;
  background: var(--pw-gradient-accent);
  color: var(--pw-on-accent);
}

.pw-podium__place--2 .pw-podium__block {
  height: 82px;
  background: var(--pw-ink-2);
}

.pw-podium__place--3 .pw-podium__block {
  height: 62px;
  background: #e05252;
}

/* Tables & leaderboard */

.pw-table-wrap {
  overflow-x: auto;
  margin: 0 -1.35rem;
  padding: 0 1.35rem;
}

.pw-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-variant-numeric: tabular-nums;
}

.pw-table th,
.pw-table td {
  padding: .75rem .6rem;
  border-bottom: 1px solid var(--pw-border);
  text-align: left;
  vertical-align: middle;
}

.pw-table thead th {
  color: var(--pw-muted);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
  white-space: nowrap;
}

.pw-table tbody tr {
  transition: background .12s;
}

.pw-table tbody tr:hover {
  background: var(--pw-surface-2);
}

.pw-table tbody tr:last-child td {
  border-bottom: 0;
}

.pw-table .pw-num {
  text-align: right;
  white-space: nowrap;
}

.pw-table .pw-actions {
  text-align: right;
  white-space: nowrap;
}

.pw-leaderboard tbody tr.is-top td {
  background: linear-gradient(90deg, var(--pw-accent-soft), transparent 60%);
}

.pw-leaderboard tbody tr.is-top:first-child td:first-child {
  box-shadow: inset 4px 0 0 var(--pw-accent);
}

.pw-team-cell {
  display: flex;
  flex-direction: column;
  gap: .1rem;
  line-height: 1.3;
}

.pw-team-cell strong {
  font-weight: 800;
}

.pw-team-cell strong em {
  margin-right: .25rem;
  color: var(--pw-accent);
  font-style: normal;
}

.pw-team-cell > span {
  color: var(--pw-muted);
  font-size: .85rem;
}

.pw-team-cell .pw-badge {
  align-self: flex-start;
  margin-top: .3rem;
}

.pw-rank {
  display: inline-grid;
  place-items: center;
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 50%;
  background: var(--pw-surface-2);
  font-weight: 850;
}

.pw-rank--1 {
  background: #dcc283;
  color: #4a4141;
}

.pw-rank--2 {
  background: #d6d0ce;
  color: #4a4141;
}

.pw-rank--3 {
  background: #d8ab86;
  color: #4a4141;
}

.pw-points {
  font-size: 1.2rem;
  font-weight: 900;
}

.pw-wl {
  font-weight: 750;
}

.pw-wl--loss {
  color: var(--pw-danger);
}

.pw-show-sm {
  display: none !important;
}

/* Tournament cards */

.pw-tournaments {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
  gap: 1rem;
}

.pw-tcard {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: .9rem;
  padding: 1.35rem 1.25rem 1.25rem;
  overflow: hidden;
  border: 1px solid var(--pw-border);
  border-radius: var(--pw-radius);
  background: var(--pw-surface);
  box-shadow: var(--pw-shadow);
  transition: transform .15s, box-shadow .15s;
}

.pw-tcard:hover {
  transform: translateY(-2px);
  box-shadow: var(--pw-shadow-lg);
}

.pw-tcard::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: var(--pw-accent);
}

.pw-tcard__title {
  font-size: 1.15rem;
  font-weight: 850;
}

.pw-tcard__meta {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem 1rem;
  color: var(--pw-muted);
  font-size: .875rem;
}

.pw-tcard__leader {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .6rem .75rem;
  border-radius: 12px;
  background: var(--pw-surface-2);
  font-size: .9rem;
}

.pw-tcard__leader strong {
  font-weight: 750;
}

/* Leader: group, both players with first and last name, points on the right */
.pw-tcard__leader-team {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-width: 0;
  line-height: 1.3;
}

.pw-tcard__leader-team small {
  overflow: hidden;
  color: var(--pw-muted);
  font-size: .84rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pw-tcard__leader-points {
  flex: none;
  color: var(--pw-muted);
  font-size: .8rem;
  text-align: right;
  white-space: nowrap;
}

.pw-tcard__leader-points b {
  display: block;
  color: var(--pw-accent-600);
  font-size: 1.15rem;
  font-weight: 850;
  line-height: 1.1;
}

.pw-progress {
  display: block;
  width: 100%;
  height: 8px;
  margin-top: .35rem;
  overflow: hidden;
  border: 0;
  border-radius: 999px;
  background: var(--pw-ink-soft);
  appearance: none;
}

.pw-progress::-webkit-progress-bar {
  background: var(--pw-ink-soft);
}

.pw-progress::-webkit-progress-value {
  border-radius: 999px;
  background: var(--pw-gradient-accent);
}

.pw-progress::-moz-progress-bar {
  border-radius: 999px;
  background: var(--pw-gradient-accent);
}

.pw-roundtile.is-done .pw-progress {
  background: rgba(255, 255, 255, .18);
}

.pw-roundtile.is-done .pw-progress::-webkit-progress-bar {
  background: rgba(255, 255, 255, .18);
}

/* Live tables (dashboard) */

.pw-tables {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr));
  gap: .8rem;
}

.pw-tablecard {
  padding: .85rem 1rem;
  border: 1px solid var(--pw-border);
  border-radius: var(--pw-radius-sm);
  background: var(--pw-surface-2);
}

.pw-tablecard.is-live {
  border-color: rgba(22, 128, 60, .35);
  background: var(--pw-surface);
  box-shadow: inset 4px 0 0 var(--pw-live);
}

.pw-tablecard__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: .6rem;
  font-weight: 850;
}

.pw-tablecard__match {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: .6rem;
  font-size: .88rem;
}

.pw-tablecard__team {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  min-width: 0;
}

.pw-tablecard__team--b {
  align-items: flex-end;
  text-align: right;
}

.pw-tablecard__score {
  font-size: 1.35rem;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* Result entry */

.pw-rounds {
  display: flex;
  gap: .5rem;
  margin-bottom: 1.25rem;
  overflow-x: auto;
  scrollbar-width: none;
}

.pw-round {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  gap: .35rem;
  min-width: 140px;
  padding: .7rem .9rem;
  border: 1px solid var(--pw-border);
  border-radius: 14px;
  background: var(--pw-surface);
  color: var(--pw-text) !important;
  text-decoration: none !important;
  transition: border-color .15s, box-shadow .15s;
}

.pw-round:hover {
  border-color: var(--pw-ink);
}

.pw-round.is-active {
  border-color: var(--pw-accent);
  box-shadow: 0 0 0 3px var(--pw-accent-soft);
}

.pw-round__label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  font-weight: 850;
}

.pw-round__count {
  color: var(--pw-muted);
  font-size: .8rem;
  font-weight: 600;
}

.pw-matches {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr));
  gap: 1rem;
}

.pw-match {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--pw-border);
  border-radius: var(--pw-radius);
  background: var(--pw-surface);
  box-shadow: var(--pw-shadow);
  overflow: hidden;
}

.pw-match__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .7rem 1rem;
  border-bottom: 1px solid var(--pw-border);
  background: var(--pw-surface-2);
}

.pw-match.is-finished .pw-match__head {
  color: #fff;
  background: var(--pw-gradient);
}

.pw-match__table {
  display: flex;
  align-items: center;
  gap: .55rem;
  font-weight: 850;
}

.pw-match__table-no {
  display: inline-grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 10px;
  background: var(--pw-ink);
  color: var(--pw-on-accent);
  font-size: .95rem;
}

.pw-match__side {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: .75rem;
  padding: .85rem 1rem;
}

.pw-match__side + .pw-match__side {
  border-top: 1px dashed var(--pw-border);
}

.pw-match__names {
  display: flex;
  flex-direction: column;
  min-width: 0;
  line-height: 1.3;
}

.pw-match__names span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pw-match__names span + span {
  color: var(--pw-muted);
  font-size: .9rem;
}

.pw-score {
  display: flex;
  align-items: center;
  gap: .35rem;
}

.pw-score__input {
  width: 4.2rem;
  height: 52px;
  padding: 0 .25rem;
  border: 2px solid var(--pw-border);
  border-radius: 14px;
  background: var(--pw-surface-2);
  color: var(--pw-text);
  font: inherit;
  font-size: 1.5rem;
  font-weight: 850;
  text-align: center;
  font-variant-numeric: tabular-nums;
  -moz-appearance: textfield;
  appearance: textfield;
}

.pw-score__input::-webkit-outer-spin-button,
.pw-score__input::-webkit-inner-spin-button {
  margin: 0;
  -webkit-appearance: none;
}

.pw-score__input:focus {
  border-color: var(--pw-accent);
  outline: 0;
  box-shadow: 0 0 0 4px var(--pw-accent-soft);
}

.pw-score__fill {
  height: 52px;
  padding: 0 .65rem;
  border: 0;
  border-radius: 12px;
  background: var(--pw-accent-soft);
  color: var(--pw-accent);
  font: inherit;
  font-size: .85rem;
  font-weight: 850;
  cursor: pointer;
}

.pw-score__fill:hover {
  background: var(--pw-accent);
  color: var(--pw-on-accent);
}

.pw-match.is-finished .pw-score__input {
  border-color: var(--pw-ink);
}

.pw-savebar {
  position: sticky;
  bottom: 1rem;
  z-index: 10;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin-top: 1.25rem;
  padding: .75rem .9rem .75rem 1.1rem;
  border: 1px solid var(--pw-border);
  border-radius: var(--pw-radius);
  background: color-mix(in srgb, var(--pw-surface) 90%, transparent);
  box-shadow: var(--pw-shadow-lg);
  backdrop-filter: blur(10px);
}

/* Forms */

.pw-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
  gap: 1.1rem;
}

.pw-field {
  display: flex;
  flex-direction: column;
  gap: .4rem;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.pw-field--wide {
  grid-column: 1 / -1;
}

.pw-label {
  padding: 0;
  font-size: .875rem;
  font-weight: 750;
}

.pw-help {
  color: var(--pw-muted);
  font-size: .82rem;
}

.pw-input,
.pw-select {
  width: 100%;
  min-height: 46px;
  padding: .6rem .85rem;
  border: 1.5px solid var(--pw-border);
  border-radius: 12px;
  background: var(--pw-surface-2);
  color: var(--pw-text);
  font: inherit;
  transition: border-color .15s, box-shadow .15s, background .15s;
}

.pw-select[multiple] {
  min-height: 7rem;
}

.pw-input:focus,
.pw-select:focus {
  border-color: var(--pw-accent);
  outline: 0;
  background: var(--pw-surface);
  box-shadow: 0 0 0 4px var(--pw-accent-soft);
}

.pw-player {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .6rem;
}

.pw-player legend {
  grid-column: 1 / -1;
  margin-bottom: .1rem;
}

.pw-choice-group {
  display: grid;
  gap: .5rem;
}

.pw-choice {
  display: flex;
  align-items: center;
  gap: .7rem;
  padding: .75rem .9rem;
  border: 1.5px solid var(--pw-border);
  border-radius: 12px;
  background: var(--pw-surface-2);
  font-weight: 600;
  cursor: pointer;
}

.pw-choice:has(input:checked) {
  border-color: var(--pw-accent);
  background: var(--pw-accent-soft);
}

.pw-choice input {
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: var(--pw-accent);
}

.pw-locked {
  padding: .75rem .9rem;
  border-radius: 12px;
  background: var(--pw-surface-2);
}

.pw-form-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .6rem;
  margin-top: 1.25rem;
}

.pw-danger-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .85rem 0;
}

.pw-danger-row + .pw-danger-row {
  border-top: 1px solid var(--pw-border);
}

.pw-danger-row p {
  flex: 1 1 280px;
}

/* Lists */

.pw-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.pw-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .65rem 0;
  border-bottom: 1px solid var(--pw-border);
}

.pw-list li:last-child {
  border-bottom: 0;
}

/* Schedule */

.pw-schedule {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 360px), 1fr));
  gap: 1rem;
}

.pw-team-list {
  margin: 0;
  padding: 0;
  list-style: none;
  columns: 2 280px;
}

.pw-team-list li {
  padding: .2rem 0;
}

.pw-team-list li b {
  display: inline-block;
  min-width: 1.8rem;
  color: var(--pw-accent-600);
  font-variant-numeric: tabular-nums;
}

/* Login */

.pw-login {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
  min-height: calc(100vh - 66px);
  padding: 2rem 1rem;
}

/* Login without the app bar: the card alone on red with notes and staff (same family as the other apps) */
.pw--frontend.pw--login {
  min-height: 100vh;
  min-height: 100dvh;
  background: #990000 url("../Images/Login/background.svg") center / cover no-repeat;
}

.pw--frontend.pw--login .pw-main {
  padding-top: 0;
  padding-bottom: 0;
}

.pw--frontend.pw--login .pw-login {
  min-height: 100vh;
  min-height: 100dvh;
}

.pw-login__tagline {
  margin: .3rem 0 0;
  color: var(--pw-accent-600);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
}

.pw-login__powered {
  margin: 0;
  color: rgba(255, 255, 255, .78);
  font-size: .82rem;
  letter-spacing: .01em;
  text-align: center;
}

.pw-login__powered b {
  color: #fff;
  font-weight: 700;
}

.pw-login__card {
  width: min(100%, 420px);
  padding: 2rem 1.75rem;
  border-top: 0;
  border-radius: 24px;
  background: var(--pw-surface);
  box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .7);
  text-align: center;
}

.pw-login__logo {
  width: 76px;
  height: 76px;
  margin: 0 auto 1rem;
  border-radius: 22px;
  box-shadow: 0 12px 24px -10px rgba(0, 0, 0, .6);
}

.pw-login__title {
  font-size: 1.6rem;
  font-weight: 850;
}

.pw-login__text {
  margin-top: .6rem !important;
}

.pw-login__form {
  display: grid;
  gap: 1rem;
  margin-top: 1.5rem;
  text-align: left;
}

.pw-login__error {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .7rem .85rem;
  border-radius: 12px;
  background: var(--pw-danger-soft);
  color: var(--pw-danger);
  font-weight: 650;
}

@media (max-width: 640px) {
  .pw-user__name {
    display: none;
  }

  .pw-player {
    grid-template-columns: 1fr;
  }

  .pw-card {
    padding: 1.1rem;
  }

  .pw-table-wrap {
    margin: 0 -1.1rem;
    padding: 0 1.1rem;
  }

  .pw-table th,
  .pw-table td {
    padding: .65rem .35rem;
  }

  .pw-hide-sm {
    display: none !important;
  }

  .pw-show-sm {
    display: inline-flex !important;
  }

  .pw-podium {
    gap: .4rem;
  }

  .pw-savebar {
    bottom: .5rem;
    padding: .5rem;
  }

  .pw-savebar > .pw-muted {
    display: none;
  }

  .pw-savebar .pw-btn {
    width: 100%;
  }
}

@media print {
  .pw-appbar,
  .pw-tabs,
  .pw-back,
  .pw-btn,
  .pw-messages,
  .pw-footer,
  .pw-module-head,
  .pw-live-status {
    display: none !important;
  }

  .pw,
  .pw--frontend {
    background: #fff;
  }

  .pw-card,
  .pw-match {
    border: 1px solid #ccc;
    box-shadow: none;
    break-inside: avoid;
  }
}

.pw-live-status--block {
  margin-bottom: 1rem !important;
}

/* Scoreboard for group 2: compact, up to 60 pairs on one screen */

.pw--board .pw-appbar__inner,
.pw--board .pw-main {
  max-width: none;
}

.pw--board .pw-appbar__inner {
  padding: .4rem 1rem;
}

.pw--board .pw-brand__logo {
  width: 34px;
  height: 34px;
}

.pw--board .pw-main {
  padding: .75rem 1rem .5rem;
}

.pw-board {
  display: flex;
  flex-direction: column;
  gap: .75rem;
}

.pw-board__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .6rem 1.25rem;
  padding: .65rem 1rem;
  border-bottom: 0;
  border-radius: 14px;
  color: #fff;
  background: var(--pw-gradient);
  box-shadow: var(--pw-shadow);
}

.pw-board__title {
  display: flex;
  flex: 1 1 240px;
  flex-direction: column;
  align-items: flex-start;
  gap: .3rem;
  min-width: 0;
  line-height: 1.25;
}

.pw-board__title strong {
  font-size: 1.25rem;
  font-weight: 850;
  line-height: 1.15;
}

.pw-board__facts {
  display: flex;
  flex-direction: column;
  gap: .15rem;
  margin-top: .15rem;
  color: rgba(255, 255, 255, .78);
  font-size: .82rem;
  line-height: 1.35;
}

.pw-board__facts > span:first-child {
  color: #fff;
  font-weight: 700;
}

.pw-board__rounds {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
}

.pw-board__round {
  display: inline-flex;
  flex-direction: column;
  min-width: 5.5rem;
  padding: .3rem .7rem;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 10px;
  background: rgba(255, 255, 255, .07);
  line-height: 1.2;
}

.pw-board__round b {
  font-size: .82rem;
}

.pw-board__round small {
  color: rgba(255, 255, 255, .7);
  font-size: .72rem;
  font-weight: 600;
}

.pw-board__round.is-live {
  border-color: var(--pw-accent);
  background: var(--pw-accent);
  box-shadow: 0 0 0 3px rgba(183, 28, 28, .35);
  color: var(--pw-on-accent);
}

.pw-board__round.is-live small {
  color: rgba(255, 255, 255, .8);
}

.pw-board__round.is-done {
  border-color: #fff;
  background: #fff;
  color: var(--pw-ink);
}

.pw-board__round.is-done small {
  color: var(--pw-muted);
}

.pw-board .pw-live-status {
  border-color: rgba(255, 255, 255, .16);
  background: rgba(255, 255, 255, .07);
  color: rgba(255, 255, 255, .85);
}

.pw-board__list {
  --pw-row: 34px;
  --pw-row-font: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
  columns: 3 330px;
  column-gap: .6rem;
}

.pw-board__row {
  display: grid;
  grid-template-columns: 1.7em minmax(0, 1fr) 2.8em 2.4em 2.7em;
  align-items: center;
  gap: .45em;
  height: var(--pw-row);
  margin-bottom: 4px;
  padding: 0 .55em;
  overflow: hidden;
  border: 1px solid var(--pw-border);
  border-radius: 9px;
  background: var(--pw-surface);
  font-size: var(--pw-row-font);
  font-variant-numeric: tabular-nums;
  line-height: 1;
  break-inside: avoid;
}

.pw-board__rank {
  display: grid;
  place-items: center;
  width: 1.75em;
  height: 1.75em;
  border-radius: 50%;
  background: var(--pw-surface-2);
  font-weight: 900;
}

.pw-board__team {
  display: flex;
  align-items: baseline;
  gap: .4em;
  min-width: 0;
  white-space: nowrap;
}

.pw-board__team em {
  flex: 0 0 auto;
  color: var(--pw-accent);
  font-size: .82em;
  font-style: normal;
  font-weight: 800;
}

.pw-board__team span {
  overflow: hidden;
  font-weight: 700;
  text-overflow: ellipsis;
}

.pw-board__wl {
  color: var(--pw-muted);
  font-weight: 700;
  text-align: center;
}

.pw-board__wl i {
  margin: 0 1px;
  font-style: normal;
}

.pw-board__pts {
  font-size: 1.12em;
  font-weight: 900;
  text-align: right;
}

.pw-board__diff {
  font-weight: 750;
  text-align: right;
}

.pw-board__diff.is-down {
  color: var(--pw-danger);
}

.pw-board__state {
  padding: .3em .2em;
  border-radius: 6px;
  background: var(--pw-surface-2);
  color: var(--pw-muted);
  font-size: .78em;
  font-weight: 800;
  text-align: center;
  white-space: nowrap;
}

.pw-board__state.is-live {
  background: var(--pw-live-soft);
  color: var(--pw-live);
}

.pw-board__state.is-done {
  background: var(--pw-ink);
  color: #fff;
}

.pw-board__row.is-podium {
  border-left: 4px solid var(--pw-gold);
}

.pw-board__row.is-rank1 {
  background: linear-gradient(90deg, rgba(183, 28, 28, .06), var(--pw-surface) 55%);
}

.pw-board__row.is-rank1 .pw-board__rank {
  background: #dcc283;
  color: #4a4141;
}

.pw-board__row.is-rank2 {
  border-left-color: #d6d0ce;
}

.pw-board__row.is-rank2 .pw-board__rank {
  background: #d6d0ce;
}

.pw-board__row.is-rank3 {
  border-left-color: #d8ab86;
}

.pw-board__row.is-rank3 .pw-board__rank {
  background: #d8ab86;
}

.pw-board__foot {
  color: var(--pw-muted);
  font-size: .75rem;
}

/* Public scoreboard link with QR code */

.pw-share {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.25rem;
}

.pw-share__qr {
  flex: 0 0 auto;
  width: 148px;
  padding: 8px;
  border-radius: 14px;
  background: #fff;
}

.pw-share__qr svg,
.pw-board__qr-code svg {
  display: block;
  width: 100%;
  height: auto;
}

.pw-share__text {
  display: flex;
  flex: 1 1 260px;
  flex-direction: column;
  align-items: flex-start;
  gap: .5rem;
}

.pw-share__url {
  max-width: 100%;
  overflow-wrap: anywhere;
  font-size: .8rem;
}

.pw-card--dark .pw-share__url a {
  color: rgba(255, 255, 255, .8);
}

.pw-board__qr {
  display: flex;
  align-items: center;
  gap: .5rem;
  color: #fff !important;
  text-decoration: none;
}

.pw-board__qr-code {
  width: 64px;
  padding: 4px;
  border-radius: 8px;
  background: #fff;
}

.pw-board__qr-text {
  max-width: 6.5rem;
  color: rgba(255, 255, 255, .8);
  font-size: .72rem;
  font-weight: 700;
  line-height: 1.25;
}

@media (max-width: 640px) {
  .pw-board__qr {
    display: none;
  }
}

.pw-board__row {
  gap: .35em;
}

.pw-board__team em {
  display: inline-grid;
  place-items: center;
  min-width: 1.8em;
  height: 1.5em;
  padding: 0 .25em;
  border-radius: 5px;
  background: var(--pw-accent);
  color: var(--pw-on-accent);
  font-size: .78em;
  align-self: center;
}

.pw-board__qr-code {
  width: 54px;
  padding: 3px;
}

.pw-board__head {
  padding: .85rem 1.15rem;
}

/* Board: organizer line, tabs "Aktuell" + rounds, round results */

.pw-board__title small {
  margin-bottom: .25rem;
  color: rgba(255, 255, 255, .7);
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.pw-board__tabs {
  display: flex;
  gap: .4rem;
  padding: .3rem;
  overflow-x: auto;
  border: 1px solid var(--pw-border);
  border-radius: 14px;
  background: var(--pw-surface);
  box-shadow: var(--pw-shadow);
  scrollbar-width: none;
}

.pw-board__tabs::-webkit-scrollbar {
  display: none;
}

.pw-board__tab {
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 6.5rem;
  padding: .45rem .8rem;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--pw-text);
  font: inherit;
  line-height: 1.2;
  cursor: pointer;
  transition: background .15s, color .15s;
}

.pw-board__tab b {
  font-size: .92rem;
  font-weight: 800;
}

.pw-board__tab small {
  color: var(--pw-muted);
  font-size: .72rem;
  font-weight: 650;
}

.pw-board__tab:hover {
  background: var(--pw-surface-2);
}

.pw-board__tab.is-live small {
  color: var(--pw-live);
}

.pw-board__tab.is-active {
  background: var(--pw-accent);
  color: #fff;
  box-shadow: none;
}

.pw-board__tab.is-active small {
  color: rgba(255, 255, 255, .7);
}

.pw-board__panel[hidden] {
  display: none !important;
}

.pw-results {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 380px), 1fr));
  gap: .6rem;
}

.pw-result {
  display: grid;
  grid-template-columns: 4.2rem minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: .6rem;
  padding: .6rem .8rem;
  border: 1px solid var(--pw-border);
  border-radius: 12px;
  background: var(--pw-surface);
}

.pw-result.is-live {
  box-shadow: inset 4px 0 0 #990000;
}

.pw-result__table {
  color: var(--pw-muted);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.pw-result__team {
  display: flex;
  flex-direction: column;
  min-width: 0;
  line-height: 1.25;
}

.pw-result__team--b {
  align-items: flex-end;
  text-align: right;
}

.pw-result__team b {
  font-size: .9rem;
  font-weight: 750;
}

.pw-result__team small {
  overflow: hidden;
  color: var(--pw-muted);
  font-size: .78rem;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}

.pw-result__team.is-winner b {
  color: var(--pw-accent-600);
}

.pw-result__team.is-winner b::after {
  content: " \2605";
  color: var(--pw-accent);
}

.pw-result__score {
  font-size: 1.25rem;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.pw-result__score i {
  margin: 0 .2rem;
  color: var(--pw-muted);
  font-style: normal;
}

/* Names in normal weight; the pair number carries the emphasis */

.pw-team-cell__names {
  color: var(--pw-text) !important;
  font-size: .9rem !important;
}

.pw-board__team span {
  font-weight: 500;
}

.pw-score__fill {
  padding: 0 .75rem;
  font-size: .8rem;
}

@media (max-width: 640px) {
  .pw-result {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  }

  .pw-result__table {
    grid-column: 1 / -1;
  }

  .pw-score__fill {
    padding: 0 .5rem;
    font-size: .72rem;
  }
}

.pw-match__names span + span {
  color: inherit;
  font-size: inherit;
}

.pw-tablecard__team .pw-num-chip {
  align-self: flex-start;
}

.pw-tablecard__team--b .pw-num-chip {
  align-self: flex-end;
}

.pw-roundtile.is-done .pw-roundtile__value {
  font-size: 1.3rem;
}

/* Winner button: "Sieger · 18 eintragen" */

.pw-score__fill {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  height: 52px;
  padding: 0 .8rem;
  border: 1.5px solid var(--pw-accent);
  border-radius: 12px;
  background: var(--pw-accent-soft);
  color: var(--pw-accent-600);
  text-align: left;
}

.pw-score__fill svg {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
}

.pw-score__fill span {
  display: flex;
  flex-direction: column;
  line-height: 1.15;
}

.pw-score__fill b {
  font-size: .9rem;
  font-weight: 800;
}

.pw-score__fill small {
  font-size: .7rem;
  font-weight: 650;
  opacity: .85;
  white-space: nowrap;
}

.pw-score__fill:hover,
.pw-score__fill:focus-visible {
  background: var(--pw-accent);
  color: #fff;
}

.pw-board__team {
  overflow: hidden;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 640px) {
  .pw-score__fill {
    padding: 0 .55rem;
  }

  .pw-score__fill svg {
    display: none;
  }
}

/* Room for both full names next to points field and winner button */
.pw-matches {
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 430px), 1fr));
}

.pw-match__names span {
  white-space: normal;
}

/* Result entry: "Gruppe N" above the two players */
.pw-match__names .pw-match__group {
  margin-bottom: .1rem;
  color: var(--pw-text);
  font-size: .95rem;
  font-weight: 800;
}

.pw-match__names .pw-match__group ~ span {
  color: var(--pw-muted);
  font-size: .85rem;
}

/* Round results: the winner stands out clearly, the loser steps back */

.pw-result__team {
  padding: .4rem .6rem;
  border: 1.5px solid transparent;
  border-radius: 10px;
}

.pw-result__team.is-winner {
  border-color: #cecccc;
  background: #f7f7f7;
}

.pw-result__team.is-winner b {
  color: inherit;
  font-size: 1rem;
  font-weight: 850;
}

.pw-result__team.is-winner b::after {
  content: none;
}

.pw-result__team.is-winner small {
  color: var(--pw-muted);
}

.pw-result__team.is-loser {
  opacity: .6;
}

.pw-result__badge {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  align-self: flex-start;
  margin-bottom: .2rem;
  padding: .1rem .45rem;
  border-radius: 999px;
  background: var(--pw-accent);
  color: #fff;
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.pw-result__team--b .pw-result__badge {
  align-self: flex-end;
}

.pw-result__badge svg {
  width: 12px;
  height: 12px;
}

.pw-result__points.is-winner {
  color: var(--pw-accent);
  font-size: 1.15em;
}

.pw-result__points.is-loser {
  color: var(--pw-muted);
  font-weight: 700;
}

/* Board: wins and losses as two labelled values */

.pw-board__row {
  grid-template-columns: 1.7em minmax(5.4em, 1fr) 3.7em 5.9em 2.3em 2.6em;
}

.pw-board__stat {
  display: flex;
  align-items: baseline;
  gap: .25em;
  white-space: nowrap;
}

.pw-board__stat b {
  min-width: 1em;
  font-weight: 800;
  text-align: right;
}

.pw-board__stat small {
  color: var(--pw-muted);
  font-size: .78em;
  font-weight: 600;
}

.pw-board__stat--losses.has-losses b {
  color: var(--pw-danger);
}

/* Board tabs on phones: make clear that they scroll sideways */

.pw-board__swipe {
  display: none;
}

@media (max-width: 760px) {
  .pw-board__tabs {
    scroll-snap-type: x proximity;
    scroll-padding-inline: .3rem;
    -webkit-overflow-scrolling: touch;
  }

  .pw-board__tab {
    flex: 0 0 auto;
    min-width: 7.4rem;
    scroll-snap-align: start;
  }

  .pw-board__tabs.can-scroll-right {
    -webkit-mask-image: linear-gradient(90deg, #000 82%, transparent);
    mask-image: linear-gradient(90deg, #000 82%, transparent);
  }

  .pw-board__tabs.can-scroll-left {
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 18%);
    mask-image: linear-gradient(90deg, transparent, #000 18%);
  }

  .pw-board__tabs.can-scroll-left.can-scroll-right {
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent);
  }

  .pw-board__tabs.is-scrollable + .pw-board__swipe {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: .4rem;
    margin: -.35rem 0 0 !important;
    color: var(--pw-muted);
    font-size: .75rem;
    font-weight: 650;
  }

  .pw-board__swipe span {
    color: var(--pw-accent);
    font-weight: 800;
    animation: pw-nudge 1.6s ease-in-out infinite;
  }

  .pw-board__swipe span:first-child {
    animation-direction: reverse;
  }
}

@keyframes pw-nudge {
  50% {
    transform: translateX(3px);
  }
}

/* Phones: logo and "MusiWatt'n" centred in the app bar, controls stay on the right */

@media (max-width: 640px) {
  .pw-appbar__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
  }

  .pw-appbar__inner > .pw-brand {
    grid-column: 2;
    justify-content: center;
  }

  .pw-appbar__inner > .pw-user {
    grid-column: 3;
    justify-self: end;
  }

  .pw-appbar .pw-brand__text small {
    display: none;
  }

  .pw-appbar .pw-brand__text strong {
    font-size: 1.25rem;
  }

  .pw-appbar .pw-brand__logo {
    width: 38px;
    height: 38px;
  }
}

/* Ranks: plain red tones instead of gold, silver and bronze */

.pw-rank--1,
.pw-board__row.is-rank1 .pw-board__rank,
.pw-podium__place--1 .pw-podium__medal {
  background: var(--pw-accent);
  color: #fff;
}

.pw-rank--2,
.pw-rank--3,
.pw-board__row.is-rank2 .pw-board__rank,
.pw-board__row.is-rank3 .pw-board__rank,
.pw-podium__place--2 .pw-podium__medal,
.pw-podium__place--3 .pw-podium__medal {
  background: var(--pw-accent-soft);
  color: var(--pw-accent-600);
}

.pw-podium__medal {
  box-shadow: none;
}

.pw-board__row.is-podium,
.pw-board__row.is-rank2,
.pw-board__row.is-rank3 {
  border-left: 3px solid var(--pw-accent-soft);
}

.pw-board__row.is-rank1 {
  border-left: 3px solid var(--pw-accent);
  background: var(--pw-surface);
}

/* Phones: avatar left, brand centre, logout right */

@media (max-width: 640px) {
  .pw-appbar__inner > .pw-user {
    display: contents;
  }

  .pw-appbar .pw-user__avatar {
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
  }

  .pw-appbar .pw-logout {
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
  }

  .pw-appbar__inner > .pw-brand {
    grid-row: 1;
  }
}

/* Dashboard: top 3 and the running round as compact, readable lists */

.pw-dash-grid {
  grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
}

.pw-dash-card .pw-subtitle {
  display: flex;
  align-items: center;
  gap: .5rem;
}

.pw-dash-card .pw-subtitle svg {
  color: var(--pw-accent);
}

.pw-top3 {
  display: grid;
  gap: .5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.pw-top3__item {
  display: grid;
  grid-template-columns: 2.4rem minmax(0, 1fr) auto;
  align-items: center;
  gap: .8rem;
  padding: .7rem .85rem;
  border: 1px solid var(--pw-border);
  border-radius: 12px;
  background: var(--pw-surface-2);
}

.pw-top3__item--1 {
  border-color: var(--pw-accent);
  background: var(--pw-accent-soft);
}

.pw-top3__rank {
  display: grid;
  place-items: center;
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 50%;
  background: var(--pw-accent-soft);
  color: var(--pw-accent-600);
  font-size: 1.1rem;
  font-weight: 900;
}

.pw-top3__item--1 .pw-top3__rank {
  background: var(--pw-accent);
  color: #fff;
}

.pw-top3__team,
.pw-top3__score {
  display: flex;
  flex-direction: column;
  min-width: 0;
  line-height: 1.25;
}

.pw-top3__team b {
  font-weight: 800;
}

.pw-top3__team small {
  overflow: hidden;
  color: var(--pw-muted);
  font-size: .82rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pw-top3__score {
  align-items: flex-end;
  text-align: right;
}

.pw-top3__score b {
  font-size: 1.35rem;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

.pw-top3__score small {
  color: var(--pw-muted);
  font-size: .75rem;
  white-space: nowrap;
}

.pw-livelist {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
  gap: .5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.pw-livelist__item {
  display: grid;
  grid-template-columns: 2rem minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: .6rem;
  padding: .6rem .75rem;
  border: 1px solid var(--pw-border);
  border-radius: 12px;
  background: var(--pw-surface);
}

.pw-livelist__item.is-live {
  box-shadow: inset 3px 0 0 var(--pw-live);
}

.pw-livelist__item.is-done {
  background: var(--pw-surface-2);
}

.pw-livelist__table {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 8px;
  background: var(--pw-ink);
  color: #fff;
  font-size: .85rem;
  font-weight: 800;
}

.pw-livelist__team {
  display: flex;
  flex-direction: column;
  min-width: 0;
  line-height: 1.2;
}

.pw-livelist__team b {
  font-size: .9rem;
  font-weight: 750;
}

.pw-livelist__team small {
  overflow: hidden;
  color: var(--pw-muted);
  font-size: .75rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pw-livelist__team--b {
  align-items: flex-end;
  text-align: right;
}

.pw-livelist__score {
  font-size: 1.1rem;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.pw-livelist__score i {
  margin: 0 .15rem;
  color: var(--pw-muted);
  font-style: normal;
}

@media (max-width: 980px) {
  .pw-dash-grid {
    grid-template-columns: 1fr;
  }
}

/* Phones: more air and layouts that fit a narrow screen */

@media (max-width: 640px) {
  .pw-main {
    padding: 1.1rem 1rem 2.5rem;
  }

  .pw-stack > * + * {
    margin-top: 1rem;
  }

  .pw-pagehead {
    margin-bottom: 1.1rem;
  }

  .pw-card__head {
    margin-bottom: .85rem;
  }

  /* Round tiles two by two, compact */
  .pw-roundtiles {
    grid-template-columns: 1fr 1fr;
    gap: .6rem;
  }

  .pw-roundtile {
    gap: .2rem;
    padding: .8rem .85rem .9rem;
  }

  .pw-roundtile__label {
    font-size: 1rem;
  }

  .pw-roundtile__value,
  .pw-roundtile.is-done .pw-roundtile__value {
    font-size: 1.3rem;
  }

  .pw-roundtile .pw-badge {
    padding: .15rem .5rem;
    font-size: .7rem;
  }

  .pw-facts {
    gap: .6rem;
  }

  .pw-fact {
    padding: .85rem 1rem;
  }

  /* Ranking as cards: rank, group and points on top, the details underneath */
  .pw-leaderboard thead {
    display: none;
  }

  .pw-leaderboard,
  .pw-leaderboard tbody {
    display: block;
  }

  .pw-leaderboard tbody tr {
    display: grid;
    grid-template-columns: 2.4rem 1fr 1fr 1fr;
    grid-template-areas:
      "rank team team points"
      "rank wins losses diff";
    gap: .45rem .6rem;
    padding: .85rem 0;
    border-bottom: 1px solid var(--pw-border);
  }

  .pw-leaderboard tbody tr:last-child {
    border-bottom: 0;
  }

  .pw-leaderboard td {
    padding: 0;
    border: 0;
    text-align: left;
  }

  .pw-leaderboard .pw-c-rank {
    grid-area: rank;
    align-self: start;
  }

  .pw-leaderboard .pw-c-team {
    grid-area: team;
  }

  .pw-leaderboard .pw-c-points {
    grid-area: points;
    text-align: right;
  }

  .pw-leaderboard .pw-c-wins {
    grid-area: wins;
  }

  .pw-leaderboard .pw-c-losses {
    grid-area: losses;
  }

  .pw-leaderboard .pw-c-diff {
    grid-area: diff;
    text-align: right;
  }

  .pw-leaderboard .pw-c-wins::after,
  .pw-leaderboard .pw-c-losses::after,
  .pw-leaderboard .pw-c-points::after {
    content: " " attr(data-label);
    color: var(--pw-muted);
    font-size: .78rem;
    font-weight: 600;
  }

  .pw-leaderboard .pw-team-cell .pw-badge {
    margin-top: .35rem;
  }

  .pw-leaderboard tbody tr.is-top td {
    background: none;
  }

  /* Pair list: both players under each other */
  .pw-teams thead {
    display: none;
  }

  .pw-teams,
  .pw-teams tbody {
    display: block;
  }

  .pw-teams tbody tr {
    display: grid;
    grid-template-columns: 2.4rem 1fr auto;
    grid-template-areas:
      "nr p1 actions"
      "nr p2 actions";
    align-items: center;
    gap: .15rem .75rem;
    padding: .7rem 0;
    border-bottom: 1px solid var(--pw-border);
  }

  .pw-teams td {
    padding: 0;
    border: 0;
  }

  .pw-teams td:nth-child(1) {
    grid-area: nr;
  }

  .pw-teams td:nth-child(2) {
    grid-area: p1;
  }

  .pw-teams td:nth-child(3) {
    grid-area: p2;
  }

  .pw-teams td:nth-child(4) {
    grid-area: actions;
  }

  /* Result entry: names over the full width, points and the winner button underneath */
  .pw-match__side {
    grid-template-columns: auto 1fr;
    grid-template-areas:
      "chip names"
      "chip score";
    row-gap: .55rem;
    padding: .85rem 1rem;
  }

  .pw-match__side > .pw-num-chip {
    grid-area: chip;
    align-self: start;
  }

  .pw-match__names {
    grid-area: names;
  }

  .pw-score {
    grid-area: score;
  }

  .pw-score__input {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
  }

  .pw-score__fill {
    flex: 0 0 auto;
    padding: 0 .9rem;
    font-size: .85rem;
  }

  .pw-score__fill svg {
    display: block;
  }

  /* Dashboard lists */
  .pw-top3__item {
    gap: .65rem;
    padding: .65rem .75rem;
  }

  .pw-livelist__item {
    grid-template-columns: 1.8rem minmax(0, 1fr) auto minmax(0, 1fr);
    gap: .5rem;
    padding: .6rem .65rem;
  }

  /* Page tabs: fade where more tabs are waiting */
  .pw-tabs.can-scroll-right {
    -webkit-mask-image: linear-gradient(90deg, #000 82%, transparent);
    mask-image: linear-gradient(90deg, #000 82%, transparent);
  }

  .pw-tabs.can-scroll-left {
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 18%);
    mask-image: linear-gradient(90deg, transparent, #000 18%);
  }

  .pw-tabs.can-scroll-left.can-scroll-right {
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent);
  }
}

/* Headings a touch darker than body text – both warm grey instead of black */

.pw-title,
.pw-subtitle,
.pw-tcard__title,
.pw-roundtile__label,
.pw-fact__value {
  color: #3d3535;
}

.pw-roundtile.is-done .pw-roundtile__label,
.pw-roundtile.is-done .pw-roundtile__value,
.pw-card--dark .pw-subtitle {
  color: #fff;
}

@media (prefers-color-scheme: dark) {
  .pw--frontend .pw-title,
  .pw--frontend .pw-subtitle,
  .pw--frontend .pw-tcard__title,
  .pw--frontend .pw-roundtile__label,
  .pw--frontend .pw-fact__value {
    color: var(--pw-text);
  }
}

@media (max-width: 640px) {
  .pw-roundtile__label {
    white-space: nowrap;
  }

  .pw-roundtile.is-upcoming .pw-badge {
    display: none;
  }
}

/* Install the app (phones, login page): card at the bottom of the screen */

.pw-install {
  position: fixed;
  right: 12px;
  bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  left: 12px;
  z-index: 1000;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: .75rem .9rem;
  align-items: center;
  max-width: 520px;
  margin: 0 auto;
  padding: 1rem;
  border: 1px solid var(--pw-border);
  border-radius: 18px;
  background: var(--pw-surface);
  box-shadow: 0 4px 10px rgba(60, 0, 0, .08), 0 24px 48px -16px rgba(60, 0, 0, .35);
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .25s ease, transform .25s ease;
}

.pw-install[hidden] {
  display: none;
}

.pw-install.is-visible {
  opacity: 1;
  transform: none;
}

.pw-install__icon {
  width: 52px;
  height: 52px;
  border-radius: 13px;
  background: #990000;
  box-shadow: 0 6px 14px -6px rgba(153, 0, 0, .6);
}

.pw-install__text {
  display: flex;
  flex-direction: column;
  gap: .2rem;
  min-width: 0;
  line-height: 1.35;
}

.pw-install__text strong {
  color: var(--pw-text);
  font-size: 1rem;
  font-weight: 800;
}

.pw-install__text span {
  color: var(--pw-muted);
  font-size: .87rem;
}

.pw-install__actions {
  display: flex;
  grid-column: 1 / -1;
  justify-content: flex-end;
  gap: .5rem;
}

.pw-install__actions .pw-btn {
  min-width: 7.5rem;
  justify-content: center;
}

.pw-install__actions [hidden] {
  display: none;
}

/* Result entry: tables that wait for the previous round */

.pw-badge--waiting {
  background: var(--pw-surface-2);
  color: var(--pw-muted);
  border: 1px solid var(--pw-border);
}

.pw-badge--waiting svg {
  width: .95em;
  height: .95em;
}

.pw-match.is-locked {
  background: var(--pw-surface-2);
  box-shadow: none;
}

.pw-match.is-locked .pw-match__side {
  opacity: .55;
}

.pw-match__waiting {
  margin: 0;
  padding: .55rem 1rem;
  border-bottom: 1px solid var(--pw-border);
  color: var(--pw-muted);
  font-size: .85rem;
  line-height: 1.4;
}

.pw-match.is-locked .pw-score__input,
.pw-match.is-locked .pw-score__fill {
  cursor: not-allowed;
}

.pw-match.is-locked .pw-score__fill {
  border-color: var(--pw-border);
  background: var(--pw-surface);
  color: var(--pw-muted);
  box-shadow: none;
}

/* Result entry: invalid result (outside 0–18, or not exactly one group with 18) */

.pw-match.is-invalid {
  border-color: var(--pw-danger);
  box-shadow: 0 0 0 3px rgba(183, 28, 28, .14);
}

.pw-match.is-invalid .pw-score__input {
  border-color: var(--pw-danger);
  background: var(--pw-danger-soft);
  color: var(--pw-danger);
}

/* Print sheet of the schedule: table × round grid and start list, compact for 60 groups */

.pw-print {
  display: none;
}

@media print {
  @page {
    size: A4 portrait;
    margin: 10mm 11mm;
  }

  body.pw-body {
    background: #fff !important;
  }

  .pw:has(.pw-print) .pw-pagehead,
  .pw-screen-only {
    display: none !important;
  }

  .pw:has(.pw-print) .pw-main {
    max-width: none;
    padding: 0;
  }

  .pw-print {
    display: block;
    color: #000;
    font-size: 9pt;
    line-height: 1.25;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .pw-print__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 8mm;
    padding-bottom: 2.5mm;
    border-bottom: 1.5pt solid #990000;
  }

  .pw-print__head div {
    display: flex;
    flex-direction: column;
  }

  .pw-print__head strong {
    font-size: 14pt;
    font-weight: 800;
  }

  .pw-print__head span {
    color: #444;
    font-size: 8.5pt;
  }

  .pw-print__title {
    margin: 4mm 0 2mm;
    color: #990000;
    font-size: 10.5pt;
    font-weight: 800;
    letter-spacing: .02em;
    text-transform: uppercase;
  }

  .pw-print__title--break {
    break-before: page;
    margin-top: 0;
  }

  .pw-print__plan {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
  }

  .pw-print__plan th,
  .pw-print__plan td {
    padding: .9mm 2mm;
    border: .5pt solid #bbb;
    text-align: center;
    white-space: nowrap;
  }

  .pw-print__plan thead th {
    background: #990000;
    color: #fff;
    font-size: 8.5pt;
    font-weight: 700;
  }

  .pw-print__plan thead th:first-child,
  .pw-print__plan tbody th {
    width: 13mm;
  }

  .pw-print__plan tbody th {
    background: #f3e6e6;
    font-weight: 800;
  }

  .pw-print__plan tbody tr:nth-child(even) td {
    background: #f7f7f7;
  }

  .pw-print__plan tr {
    break-inside: avoid;
  }

  .pw-print__plan b {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
  }

  .pw-print__plan i {
    margin-left: 2mm;
    color: #555;
    font-size: 8pt;
    font-style: normal;
  }

  .pw-print__teams {
    margin: 0;
    padding: 0;
    list-style: none;
    columns: 2;
    column-gap: 8mm;
  }

  .pw-print__teams li {
    display: flex;
    gap: 2.5mm;
    padding: .8mm 0;
    border-bottom: .5pt solid #ddd;
    break-inside: avoid;
  }

  .pw-print__teams b {
    flex: none;
    width: 7mm;
    color: #990000;
    font-weight: 800;
    text-align: right;
    font-variant-numeric: tabular-nums;
  }

  .pw-print__teams span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

/* Print sheet with "Gruppe 1 – Gruppe 2": a little smaller so four rounds fit side by side */
@media print {
  .pw-print__plan th,
  .pw-print__plan td {
    padding: .9mm 1.2mm;
    font-size: 8pt;
  }

  .pw-print__plan thead th:first-child,
  .pw-print__plan tbody th {
    width: 10mm;
  }

  .pw-print__plan i {
    margin-left: 1.5mm;
    font-size: 7.5pt;
  }

  .pw-print__teams b {
    width: 17mm;
    text-align: left;
  }
}

/* Print sheet: groups aligned left, results aligned right – every column reads in one line */
@media print {
  .pw-print__plan td {
    text-align: left;
  }

  .pw-print__cell {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1.5mm;
  }

  .pw-print__cell i {
    margin-left: 0;
    text-align: right;
    font-variant-numeric: tabular-nums;
  }
}

/* App login exactly like the TYPO3 backend login: wordmark, plain form, "… powered by …" at the bottom right */

.pw--frontend.pw--login .pw-login {
  position: relative;
  gap: 0;
  padding: 2rem 1rem 4.5rem;
}

.pw-login__card {
  width: min(100%, 400px);
  padding: 2.5rem 2.5rem 2.25rem;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 30px 80px rgba(40, 0, 0, .45), 0 0 0 1px rgba(255, 255, 255, .06);
  text-align: left;
}

.pw-login__brand {
  margin: 0 0 1.75rem;
  line-height: 0;
}

.pw-login__brand img {
  display: block;
  width: 100%;
  max-width: 280px;
  height: auto;
}

.pw-login__card .pw-login__text {
  margin: 0 0 1rem !important;
  text-align: left;
}

.pw-login__card .pw-login__form {
  gap: 1.1rem;
  margin-top: 0;
}

.pw-login__card .pw-label {
  color: #1f1a1a;
  font-size: .9rem;
  font-weight: 700;
}

.pw-login__card .pw-input {
  height: 2.75rem;
  border: 1px solid #b9b2b2;
  border-radius: 10px;
  background: #fff;
}

.pw-login__card .pw-input:focus {
  border-color: #b71c1c;
  box-shadow: 0 0 0 .25rem rgba(183, 28, 28, .16);
}

.pw-login__submit {
  width: 100%;
  height: 2.75rem;
  margin-top: .35rem;
  border: 1px solid #990000;
  border-radius: 12px;
  background: #b71c1c;
  color: #fff;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(153, 0, 0, .35);
  transition: background-color .15s ease;
}

.pw-login__submit:hover,
.pw-login__submit:focus-visible {
  background: #c62828;
}

.pw-login__powered {
  position: absolute;
  right: 1.5rem;
  bottom: 1.5rem;
  margin: 0;
  color: rgba(255, 255, 255, .78);
  font-size: .85rem;
  font-weight: 400;
  letter-spacing: .01em;
}

@media (max-width: 640px) {
  .pw-login__card {
    padding: 2rem 1.6rem 1.9rem;
  }

  .pw-login__powered {
    right: 1rem;
    left: 1rem;
    text-align: center;
  }
}

/* App login like the backend login: 320px card with logo and form, "… powered by …" centred under the card */

.pw-login__card {
  width: min(100%, 320px);
  padding: 2.25rem 2.2rem 0;
  overflow: hidden;
}

.pw-login__brand img {
  max-width: 250px;
}

.pw-login__card .pw-login__form {
  margin-bottom: 3em;
}

@media (max-width: 640px) {
  .pw-login__card {
    padding: 2rem 1.6rem 0;
  }
}

.pw--frontend.pw--login .pw-login {
  gap: 1.75rem;
  padding: 2rem 1rem;
}

/* Same type as the footnote of the TYPO3 backend login */
.pw-login__powered {
  position: static;
  margin: 0;
  color: rgba(255, 255, 255, .78);
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 11.4px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: .01em;
  text-align: center;
}

.pw-login__powered b {
  color: #fff;
  font-weight: 700;
}

/* App bar: "MusiWatt'n" as wordmark like the login logo – "Musi" and "Watt'n" in two tones, tight and heavy */
.pw-brand__text .pw-wordmark {
  font-family: Inter, "Segoe UI Variable", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  font-size: 1.3rem;
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.1;
}

.pw-wordmark__accent {
  color: #ffffff;
}

.pw-brand__text small {
  margin-top: .15rem;
  font-family: Inter, "Segoe UI Variable", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .21em;
}

/* Opening screen of the installed app: #990000 with the app icon (white cards on #990000) (shown once per start, see launch.js) */
.pw-launch {
  display: none;
}

/* Red from the very first paint, before the page itself is drawn */
html.pw-launching,
html.pw-launching body {
  background: #990000;
}

.pw-launching .pw-launch {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #990000;
  animation: pw-launch-out .45s ease 1s forwards;
}

/* Same size as the opening screen of Android, so the change from the phone's screen to the app does not jump */
.pw-launch__icon {
  width: min(64vw, 240px);
  height: auto;
}

@keyframes pw-launch-out {
  to { opacity: 0; visibility: hidden; }
}

@media (prefers-reduced-motion: reduce) {
  .pw-launching .pw-launch { animation-duration: .01s; }
}
