/* Farkle screen. Game-specific only; everything else comes from styles.css. */
.fk-board { margin-bottom: .75rem; }
.fk-seats { margin-bottom: .4rem; }
.fk-score { color: #fff; font-size: 1.05rem; }
.fk-live { color: var(--good); font-weight: 700; }
.fk-tag {
  display: inline-block; margin-left: .35rem; padding: 0 .45rem; border-radius: 999px;
  background: var(--gold); color: #1b1b1b; font-size: .75rem; font-weight: 800; vertical-align: middle;
}
.fk-target { margin: 0; }
.fk-final { color: var(--gold); font-weight: 700; }

.fk-farkle { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .75rem; }
.fk-farkle strong { font-size: 1.15rem; }
.fk-mini { margin: 0; gap: .3rem; }

.fk-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .25rem .75rem; }
.fk-head h2 { margin: 0; }
.fk-points { margin: 0; font-size: 1.1rem; }
.fk-points b { color: var(--gold); font-size: 1.25rem; }

.fk-kept { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .9rem; margin: .6rem 0 .2rem; }
.fk-group { display: inline-flex; align-items: center; gap: .3rem; }
.fk-group .dice { margin: 0; gap: .25rem; }
.fk-pts { color: var(--good); font-weight: 700; font-size: .9rem; }

/* the current roll: big dice, three to a row on a phone */
.fk-roll { justify-content: center; gap: .8rem; max-width: 15rem; margin: 1rem auto .5rem; }
.fk-roll .die { width: 3.7rem; height: 3.7rem; padding: .45rem; }
.fk-roll .die .dot { width: .62rem; height: .62rem; }
.fk-roll .die.selected { box-shadow: 0 0 0 3px var(--gold), 0 4px 10px rgba(0, 0, 0, .45); }
.fk-roll button.die:disabled { cursor: progress; }
@media (min-width: 34rem) { .fk-roll { max-width: none; } }

.fk-sel { text-align: center; font-weight: 700; margin: .25rem 0 .5rem; min-height: 1.5em; }
.fk-sel.good { color: var(--good); }
.fk-sel.bad { color: var(--bad); }
.fk-all { margin-top: .25rem; }
.fk-hint { text-align: center; margin: 0; }
.fk-go { font-size: 1.35rem; min-height: 64px; margin: 1rem 0 .25rem; }
.fk-wait { text-align: center; margin: 1rem 0 .25rem; }
