/* Daily Word — game-specific styles */
.dw-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  height: 100%;
  padding: 12px;
}
.dw-mode { margin: 0; font-size: 0.85rem; color: var(--muted); }
.dw-grid {
  display: grid;
  gap: 6px;
  width: min(100%, 320px);
}
.dw-row { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
.dw-tile {
  aspect-ratio: 1 / 1;
  display: grid;
  place-items: center;
  font-family: var(--font-display);
  font-size: clamp(1.3rem, 6vw, 1.9rem);
  line-height: 1;
  color: #f2f4ff;
  border: 2px solid rgba(255, 255, 255, 0.14);
  border-radius: 10px;
  background: transparent;
}
.dw-tile.has-letter { border-color: rgba(255, 255, 255, 0.4); }
.dw-pop { animation: dw-pop 110ms ease-out; }
.dw-flip { animation: dw-flip 380ms ease-in-out; }
.dw-correct { background: #c6ff3d; border-color: #c6ff3d; color: #0b0d17; }
.dw-present { background: #ffb13d; border-color: #ffb13d; color: #0b0d17; }
.dw-absent { background: #2a3050; border-color: #2a3050; color: #a7aecb; }
.dw-shake { animation: dw-shake 360ms; }
@keyframes dw-pop { 50% { scale: 1.12; } }
@keyframes dw-flip { 0% { transform: scaleY(1); } 50% { transform: scaleY(0.1); } 100% { transform: scaleY(1); } }
@keyframes dw-shake { 20%, 60% { translate: -6px 0; } 40%, 80% { translate: 6px 0; } }
.dw-kb { display: grid; gap: 6px; width: min(100%, 520px); }
.dw-kb-row { display: flex; justify-content: center; gap: 5px; }
.dw-key {
  flex: 1 1 0;
  min-width: 0;
  height: 48px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: #1e2440;
  color: #f2f4ff;
  font: 700 0.95rem var(--font-display);
  cursor: pointer;
  touch-action: manipulation;
}
.dw-key-wide { flex: 1.6 1 0; font-size: 0.8rem; }
.dw-key:hover { background: #262d4f; }
.dw-key.dw-correct { background: #c6ff3d; color: #0b0d17; }
.dw-key.dw-present { background: #ffb13d; color: #0b0d17; }
.dw-key.dw-absent { background: #12162a; color: #6c7396; }
@media (prefers-reduced-motion: reduce) {
  .dw-pop, .dw-flip, .dw-shake { animation: none; }
}
