/* ── Hausvorteil, Gebuehren, Renn-Topf, Gewinn-Uebersicht (v3.84) ──────────
   Eigene Datei, damit design.css unberuehrt bleibt. Nur Tokens aus design.css
   (--t-*, --ls-*, Farben, Abstaende); keine breite Display-Schrift, alles
   scharf und ruhig wie der Rest der Seite. */

/* Chip im Spielkopf: sieht aus wie seine Nachbarn — und wird golden, sobald
   der getippte Einsatz eine Staffel-Stufe ueberschreitet. Die Farbe ist der
   Hinweis, der Text („Edge at this bet") die Aussage. */
.spiel-titel__werte > .haus-edge-chip { transition: border-color .15s ease, background-color .15s ease, color .15s ease }
.spiel-titel__werte > .haus-edge-chip.ist-stufe {
  border-color: color-mix(in srgb, var(--gold) 55%, transparent);
  background: color-mix(in srgb, var(--gold) 12%, transparent);
  color: var(--text);
}
.spiel-titel__werte > .haus-edge-chip.ist-stufe b { color: var(--gold) }

/* Fairness-Seite: „House edge and fees". */
.haus-einleitung { margin-bottom: var(--s4); max-width: 92ch }
.haus-tbl { width: 100%; font: var(--t-klein) }
.haus-tbl th, .haus-tbl td { padding: 8px 10px; vertical-align: top }
.haus-tbl th { font: var(--t-etikett); letter-spacing: var(--ls-etikett); text-transform: uppercase; color: var(--muted); white-space: nowrap }
.haus-tbl th small { display: block; margin-top: 3px; font: var(--t-etikett-klein); color: var(--gold); letter-spacing: var(--ls-etikett) }
.haus-tbl td small { display: block; margin-top: 2px; color: var(--muted); font: var(--t-klein); white-space: normal }
.haus-tbl td b { color: var(--text) }
/* v3.87: warum der wirkliche Vorteil vom eingestellten abweicht (GET /api/hausvorteil, spiele[].hinweis). */
.haus-tbl td small.haus-hinweis { margin-top: 5px; opacity: .8 }
.haus-tbl .r { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap }
.haus-tbl tfoot td { border-top: 1px solid var(--line) }
.haus-leise { color: var(--muted) }
.haus-plus { color: var(--green) }
.haus-minus { color: var(--red) }

.haus-gebuehren { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--s3); margin-top: var(--s4) }
.haus-gebuehr { display: grid; gap: 3px; align-content: start; padding: var(--s3) var(--s4); border: 1px solid var(--line); border-radius: var(--r-md); background: rgba(255,255,255,.02) }
.haus-gebuehr b { font: var(--t-etikett); letter-spacing: var(--ls-etikett); text-transform: uppercase; color: var(--muted) }
.haus-gebuehr span { font: var(--t-zeile); color: var(--text) }
.haus-gebuehr small { font: var(--t-klein); color: var(--muted) }

/* Nachrechner: der Vorteil der Runde. */
.haus-vorteil { display: grid; gap: 3px; margin-top: var(--s3) }
.haus-vorteil > b { font: var(--t-zahl); color: var(--gold) }

/* Battle-Builder: Hinweis neben dem Bots-Schalter; deutlicher, sobald Bots an sind. */
.bt-botgebuehr { margin: -4px 0 0; text-align: left }
.bt-botgebuehr.ist-an { color: var(--gold) }
.bt-a2-botgebuehr { border-color: color-mix(in srgb, var(--gold) 45%, transparent); color: var(--gold); font: var(--t-knopf-klein); cursor: help }
.bt-a2-botteil { color: var(--gold) }

/* Jackpot: Gebuehr unter dem Einsatzfeld. */
.jp-gebuehr { margin-top: 6px; font: var(--t-klein); color: var(--muted); line-height: 1.5 }

/* Race: „Pool so far … of max …". */
.race-topfhinweis { margin-top: 6px; font: var(--t-klein); color: var(--muted); max-width: 70ch }
.race-topfhinweis:empty { display: none }
.race-topfhinweis.ist-warnung { color: var(--gold) }

/* Admin: Stufen-Tabelle und Felder. */
.haus-schalter { display: flex; align-items: center; gap: 8px; margin-bottom: var(--s3); font: var(--t-zeile) }
.haus-stufen { width: 100%; margin-bottom: var(--s3) }
.haus-stufen th { font: var(--t-etikett); letter-spacing: var(--ls-etikett); text-transform: uppercase; color: var(--muted); text-align: left; padding: 6px 8px }
.haus-stufen td { padding: 4px 8px; font: var(--t-klein); color: var(--text-2) }
.haus-stufen td:first-child { white-space: nowrap; width: 1% }
.haus-stufen .input { min-height: 36px }
.haus-felder { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--s3) var(--s4); margin-bottom: var(--s4) }

/* Admin: Gewinn-Uebersicht. */
.haus-gewinn-karte { margin-top: 16px }
.haus-gewinn__kopf { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s3); margin-bottom: var(--s4) }
.haus-gewinn__kopf .haus-schalter { margin: 0 0 0 auto }
.haus-kacheln { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: var(--s3); margin-bottom: var(--s4) }
.haus-kachel { display: grid; gap: 4px; align-content: start; padding: var(--s4); border: 1px solid var(--line); border-radius: var(--r-md); background: rgba(255,255,255,.02) }
.haus-kachel small { font: var(--t-etikett); letter-spacing: var(--ls-etikett); text-transform: uppercase; color: var(--muted) }
.haus-kachel b { font: var(--t-zahl-gross); color: var(--text); font-variant-numeric: tabular-nums }
.haus-kachel b.haus-plus { color: var(--green) }
.haus-kachel b.haus-minus { color: var(--red) }
.haus-kachel span { font: var(--t-klein); color: var(--muted) }
.haus-gewinn__raster { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: var(--s4); margin-bottom: var(--s3) }
.haus-gewinn__raster h4 { margin: 0 0 var(--s2); font: var(--t-abschnitt); letter-spacing: var(--ls-abschnitt); text-transform: uppercase; color: var(--muted) }
.haus-gewinn__breit { grid-column: 1 / -1 }

@media (max-width: 900px) {
  .haus-gewinn__raster { grid-template-columns: minmax(0, 1fr) }
}
@media (max-width: 600px) {
  .haus-tbl th, .haus-tbl td { padding: 7px 8px }
  /* Handy: die drei Vorteils-Spalten muessen ohne Querschieben lesbar sein — „Highest win" steht im Spielkopf. */
  .haus-tbl--fair th:last-child, .haus-tbl--fair td:last-child { display: none }
  .haus-tbl.haus-tbl--fair th, .haus-tbl.haus-tbl--fair th.r { white-space: normal }
  .haus-tbl.haus-tbl--fair th small { white-space: nowrap }
  .haus-tbl--fair th, .haus-tbl--fair td { padding: 7px 5px }
  .haus-gewinn__kopf .haus-schalter { margin-left: 0 }
  .haus-kachel b { font: var(--t-zahl) }
}
