/* Wortschmiede - spielspezifisch (Praefix g-ws-) */
.g-ws-diff { display: grid; gap: 8px; max-width: 360px; margin: 0 auto 14px; }
.g-ws-diff .g-btn { text-align: left; display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.g-ws-diff .g-btn small { opacity: .75; font-weight: 500; }
.g-ws-rules { list-style: none; padding: 0; margin: 0 auto 14px; max-width: 360px; color: var(--g-muted); font-size: .9rem; line-height: 1.7; text-align: left; }
.g-ws-label { text-align: center; color: var(--g-muted); font-size: .85rem; margin: 10px 0 6px; }
.g-ws-slots, .g-ws-tiles { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 4px 0; }
.g-ws-slot, .g-ws-tile { width: var(--ws-size, 44px); height: var(--ws-size, 44px); border-radius: 10px; display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: calc(var(--ws-size, 44px) * .5); font-family: inherit; padding: 0; line-height: 1; }
.g-ws-slot { border: 2px dashed var(--g-line); background: rgba(0,0,0,.22); color: #fff; cursor: default; }
.g-ws-slot.g-fill { border: 2px solid var(--g-gold); background: rgba(212,175,55,.16); color: var(--g-gold-l); cursor: pointer; }
.g-ws-tile { border: 1px solid rgba(255,255,255,.22); background: linear-gradient(160deg, var(--g-petrol-l), var(--g-petrol)); color: #fff; cursor: pointer; touch-action: manipulation; transition: transform .1s, opacity .1s; }
.g-ws-tile:hover:not(:disabled) { transform: translateY(-2px); }
.g-ws-tile:disabled { opacity: .18; cursor: default; transform: none; }
.g-ws-slots.g-ok .g-ws-slot { border-color: var(--g-ok); color: var(--g-ok); background: rgba(95,211,141,.14); }
.g-ws-slots.g-bad .g-ws-slot { border-color: var(--g-bad); color: var(--g-bad); }
.g-ws-slots.g-bad { animation: g-ws-shake .45s; }
.g-ws-slots.g-reveal .g-ws-slot { border-color: var(--g-bad); color: #fff; }
@keyframes g-ws-shake { 0%,100% { transform: translateX(0); } 20% { transform: translateX(-8px); } 40% { transform: translateX(8px); } 60% { transform: translateX(-5px); } 80% { transform: translateX(5px); } }
.g-ws-msg { min-height: 1.5em; text-align: center; font-weight: 600; margin: 6px 0; color: var(--g-gold-l); }
.g-ws-msg.g-bad { color: var(--g-bad); }
.g-ws-msg.g-ok { color: var(--g-ok); }
.g-ws-low b { color: var(--g-bad) !important; }
@media (max-width: 480px) { .g-ws-diff .g-btn small { display: none; } }
