/* Würfel-Apps: Würfelreihe, Tisch, Spielerwechsel (ergänzt /shared/karten/liste.css) */
.ws { display: flex; flex-direction: column; gap: var(--a-5); padding-bottom: 0; max-width: 1000px; }
.ws__tisch {
  padding: var(--a-6) var(--a-4); border-radius: var(--r-karte-gross); background: var(--c-flaeche); border: 1px solid var(--c-linie);
  display: flex; flex-direction: column; align-items: center; gap: var(--a-4); text-align: center;
}
.ws__tisch h2 { margin: 0; font-size: clamp(24px, 5vw, 34px); }
.ws__info { margin: 0; color: var(--c-text-leise); }
.ws__ergebnis { font-family: var(--schrift-display); font-weight: 800; font-size: clamp(30px, 7vw, 48px); line-height: 1.1; margin: 0; }
.ws__knoepfe { display: flex; flex-wrap: wrap; gap: var(--a-3); justify-content: center; width: 100%; }
.ws__knoepfe .btn { flex: 1 1 200px; max-width: 360px; }
.wr { display: flex; flex-wrap: wrap; gap: clamp(10px, 3vw, 20px); justify-content: center; min-height: 96px; }
.wr__knopf { padding: 0; border: 0; background: none; border-radius: 22%; cursor: pointer; line-height: 0; transition: transform var(--dauer-kurz) var(--kurve); display: inline-block; }
span.wr__knopf { cursor: default; }
.wr__knopf .wuerfel { width: clamp(64px, 18vw, 104px); height: clamp(64px, 18vw, 104px); }
.wr[data-anzahl="5"] .wr__knopf .wuerfel, .wr[data-anzahl="6"] .wr__knopf .wuerfel, .wr[data-anzahl="5"] .wr__verdeckt, .wr[data-anzahl="6"] .wr__verdeckt { width: clamp(50px, 14vw, 88px); height: clamp(50px, 14vw, 88px); }
.wr[data-anzahl="5"], .wr[data-anzahl="6"] { gap: clamp(6px, 2vw, 16px); min-height: 72px; }
.wr__knopf[aria-pressed="true"] { transform: translateY(-4px); }
.wr__knopf[aria-pressed="true"]::after { content: attr(data-label); display: block; margin-top: var(--a-2); font-size: 13px; font-weight: 700; line-height: 1.2; color: var(--c-akzent); text-align: center; }
.wr__knopf:disabled { cursor: default; }
.wr__verdeckt { display: grid; place-items: center; width: clamp(64px, 18vw, 104px); height: clamp(64px, 18vw, 104px); border-radius: 22%; background: var(--c-flaeche-2); border: 2px dashed var(--c-chip-rand); font-family: var(--schrift-display); font-size: 36px; color: var(--c-text-leise); }
@media (prefers-reduced-motion: no-preference) {
  .wr.rollt .wr__knopf[aria-pressed="false"] { animation: wackeln 150ms linear infinite; }
}
@keyframes wackeln { 0% { transform: rotate(-8deg); } 50% { transform: rotate(8deg) translateY(-3px); } 100% { transform: rotate(-8deg); } }
.werteraster { display: grid; grid-template-columns: repeat(auto-fill, minmax(68px, 1fr)); gap: var(--a-2); width: 100%; }
.werteraster button { min-height: 52px; border-radius: var(--r-button); border: 1px solid var(--c-linie); background: var(--c-flaeche-2); color: var(--c-text); font-family: var(--schrift-display); font-size: 20px; font-weight: 700; }
.werteraster button small { display: block; font-family: var(--schrift-text); font-size: 11px; font-weight: 700; line-height: 1.1; }
.werteraster button:hover { border-color: var(--c-akzent); }
.werteraster button.hoch { border-color: var(--c-akzent); color: var(--c-akzent); }
.becherfeld {
  width: min(100%, 420px); min-height: 180px; border-radius: var(--r-karte-gross); border: 2px dashed var(--c-chip-rand);
  display: grid; place-items: center; gap: var(--a-2); padding: var(--a-4); color: var(--c-text-leise); background: var(--c-hintergrund);
  user-select: none; -webkit-user-select: none; touch-action: none; cursor: pointer;
}
.becherfeld.offen { border-style: solid; border-color: var(--c-akzent); }
.uebergabe { display: grid; place-items: center; gap: var(--a-4); min-height: 50vh; text-align: center; }
.uebergabe .icon { width: 64px; height: 64px; color: var(--c-akzent); }
.leben { display: inline-flex; gap: 2px; flex-wrap: wrap; justify-content: center; }
.leben i { width: 8px; height: 8px; border-radius: 50%; background: var(--c-akzent); }
.leben i.weg { background: transparent; border: 1.5px solid var(--c-chip-rand); }
.deckel-topf { display: inline-flex; align-items: center; gap: var(--a-2); font-weight: 700; }
.ergebnisliste { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--a-1); width: 100%; max-width: 520px; text-align: left; }
.ergebnisliste li { display: flex; align-items: center; gap: var(--a-3); padding: var(--a-2) var(--a-3); border-radius: var(--r-button-klein); background: var(--c-hintergrund); }
.ergebnisliste li b { margin-left: auto; font-family: var(--schrift-display); }
.ergebnisliste .wuerfel { width: 26px; height: 26px; }
.ergebnisliste li.gewinner { outline: 1.5px solid var(--c-hinweis-tipp); }
.ergebnisliste li.verlierer { outline: 1.5px solid var(--c-akzent); }
.augenwahl { display: grid; gap: var(--a-2); width: 100%; max-width: 420px; }
.augenwahl__reihe { display: grid; grid-template-columns: 3ch repeat(6, 1fr); gap: var(--a-1); align-items: center; }
.augenwahl__reihe button { min-height: 44px; padding: 2px; border-radius: var(--r-button-klein); border: 1px solid var(--c-linie); background: var(--c-flaeche-2); line-height: 0; }
.augenwahl__reihe button[aria-pressed="true"] { border-color: var(--c-akzent); background: color-mix(in srgb, var(--c-akzent) 25%, var(--c-flaeche-2)); }
.augenwahl__reihe .wuerfel { width: 30px; height: 30px; }
/* Block (Würfelpoker) */
.block-tabelle .tabelle th, .block-tabelle .tabelle td { padding: 6px var(--a-2); white-space: nowrap; }
.block-tabelle td.feld { cursor: pointer; text-align: center; }
.block-tabelle td.feld:hover { background: var(--c-flaeche-2); }
.block-tabelle td.vorschlag { color: var(--c-akzent); font-style: italic; }
.block-tabelle td.aktiv-spalte, .block-tabelle th.aktiv-spalte { background: color-mix(in srgb, var(--c-akzent) 8%, transparent); }
.block-tabelle tr.summe td, .block-tabelle tr.summe th { border-top: 2px solid var(--c-linie); font-weight: 700; }
.vorschlaege { display: flex; flex-wrap: wrap; gap: var(--a-2); justify-content: center; }
/* Strichliste */
.striche { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: var(--a-3); }
.person { padding: var(--a-4); border: 1px solid var(--c-linie); border-radius: var(--r-karte); background: var(--c-flaeche); display: grid; gap: var(--a-3); }
.person__kopf { display: flex; justify-content: space-between; align-items: baseline; gap: var(--a-2); }
.person__kopf b { font-size: 19px; }
.person__summe { font-family: var(--schrift-display); font-size: 22px; color: var(--c-akzent); }
.person__getraenke { display: flex; flex-wrap: wrap; gap: var(--a-2); }
.strich-knopf {
  display: inline-flex; flex-direction: column; align-items: center; min-width: 84px; min-height: 64px; padding: var(--a-2) var(--a-3);
  border-radius: var(--r-button); border: 1.5px solid var(--c-chip-rand); background: var(--c-hintergrund); color: var(--c-text); font: inherit; cursor: pointer; user-select: none; -webkit-user-select: none; touch-action: manipulation;
}
.strich-knopf b { font-family: var(--schrift-display); font-size: 26px; line-height: 1; }
.strich-knopf small { font-size: 13px; color: var(--c-text-leise); }
.strich-knopf:hover { border-color: var(--c-akzent); }
.strich-knopf.hat b { color: var(--c-akzent); }
.strich-knopf.gedrueckt { transform: scale(.96); }
.getraenkeliste { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--a-1); }
.getraenkeliste li { display: flex; align-items: center; gap: var(--a-3); padding: var(--a-1) 0; border-bottom: 1px solid var(--c-linie); }
.getraenkeliste li span { flex: 1; font-weight: 700; }
/* Schocken: nur Deckel zählen */
.zettel { display: grid; gap: var(--a-2); width: 100%; max-width: 520px; text-align: left; }
.zettel p { margin: var(--a-2) 0 0; }
.zettel .segment { flex-wrap: wrap; }
