.ws-head { display: flex; justify-content: center; align-items: baseline; gap: 10px; margin: 14px 0 8px; }
.ws-theme { font-size: 20px; font-weight: 800; letter-spacing: -0.01em; }
.ws-count { color: var(--muted); font-size: 14px; font-weight: 600; }
.ws-stage { display: flex; justify-content: center; }
.ws-wrap { position: relative; padding: 8px; border-radius: 18px; border: 1px solid var(--line); background: rgba(255, 255, 255, 0.035); }
.ws-grid {
  --n: 8;
  --cell: 38px;
  display: grid;
  grid-template-columns: repeat(var(--n), var(--cell));
  grid-auto-rows: var(--cell);
  touch-action: none;
  cursor: pointer;
  position: relative;
  z-index: 1;
}
.ws-cell {
  display: grid;
  place-items: center;
  font-size: calc(var(--cell) * 0.5);
  font-weight: 700;
  color: var(--text);
  user-select: none;
  -webkit-user-select: none;
  border-radius: 50%;
}
.ws-cell.hint { animation: ws-hint 0.7s ease-in-out 4; }
@keyframes ws-hint { 50% { background: rgba(253, 224, 71, 0.45); color: #0b1024; } }
.ws-lines { position: absolute; left: 8px; top: 8px; pointer-events: none; z-index: 0; }

.ws-words { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; max-width: 520px; margin: 14px auto 8px; }
.ws-word { font-size: 13px; font-weight: 700; letter-spacing: 0.04em; padding: 5px 10px; border-radius: 999px; border: 1px solid var(--line); background: var(--panel); color: var(--text); transition: all 0.2s; }
.ws-word.found { color: var(--muted); text-decoration: line-through; text-decoration-thickness: 2px; text-decoration-color: var(--c); border-color: var(--c); background: transparent; }
@media (prefers-reduced-motion: reduce) { .ws-cell.hint { animation: none; background: rgba(253, 224, 71, 0.45); } }
