.hold {
  background: linear-gradient(160deg, #241f19, #17140f);
  border: 2px solid var(--gold-dim); border-radius: 18px; min-height: 190px;
  display: flex; align-items: center; justify-content: center; text-align: center; padding: 18px;
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; touch-action: none;
  margin-bottom: 14px; cursor: pointer;
}
.hold.on { border-color: var(--gold); background: linear-gradient(160deg, #3a2d16, #1c160c); }
.hold-hint { color: var(--text); }
.role-content .icon { font-size: 3.6rem; line-height: 1.1; }
.role-content .rname { font-family: var(--serif); font-size: 2rem; color: var(--gold); }
.role-content .rfaction { margin: 4px 0 10px; }
.role-content .rdesc { font-size: 1.05rem; max-width: 560px; margin: 0 auto; }
.role-content .rgoal { margin-top: 10px; color: var(--muted); }

.night {
  position: fixed; inset: 0; z-index: 40; background: #030303; color: #6b6458;
  display: flex; align-items: center; justify-content: center; text-align: center; padding: 24px;
}
.night-inner { max-width: 520px; }
.moon { font-size: 5rem; color: #3b3630; }
.night-title { font-family: var(--serif); font-size: 2.4rem; color: #8a7f6c; margin: 8px 0; }
.night-sub { font-size: 1.1rem; }

/* Dienos metu rolės kortelė kompaktiška – telefone daugiau vietos balsavimui */
body.compact-role .hold { min-height: 84px; padding: 10px 14px; }
body.compact-role .hold-hint > div:first-child { display: none; }
.vote-grid { display: grid; gap: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 600px) { .vote-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); } }
.vote-grid button { width: 100%; min-height: 54px; padding: 10px 12px; overflow-wrap: anywhere; }
.vote-confirm { position: sticky; bottom: 10px; z-index: 5; box-shadow: 0 6px 24px rgba(0,0,0,.6); }
.speaker { text-align: center; padding: 14px; margin-bottom: 14px; }
@media (max-width: 420px) { .timer.huge { font-size: 5.5rem; } .wrap { padding: 12px; } }
.speaker .who { font-size: 1.3rem; font-weight: 700; }
.vote-btn { text-align: left; }
.out-banner { background: #2a1210; border: 1px solid var(--red); border-radius: var(--radius); padding: 14px; text-align: center; margin-bottom: 14px; }
.winner { font-family: var(--serif); font-size: 2.2rem; color: var(--gold); text-align: center; margin: 10px 0; }