/* Bürokratopia – Amtswort des Tages (0.16.0). Präfix s-amtswort-, Variablen aus app.css.
   Raster: bis 10 Felder je Zeile (--n im JS gesetzt). Tastatur QWERTZ mit Umlauten: Tasten 54 px hoch; bei 11 Tasten je Reihe
   auf 375 px rund 28 px breit (wie Handytastaturen), Löschen und Prüfen breiter. */
.s-amtswort-karte { padding: 14px 10px 16px; }
.s-amtswort-raster { display: grid; gap: 6px; justify-content: center; margin: 4px auto 8px; }
.s-amtswort-zeile { display: grid; grid-template-columns: repeat(var(--n, 7), 1fr); gap: 5px; width: min(100%, calc(var(--n, 7) * 46px + (var(--n, 7) - 1) * 5px)); margin: 0 auto; }
.s-amtswort-feld { aspect-ratio: 1; display: grid; place-items: center; min-width: 0; border: 2px solid var(--linie); border-radius: 6px; background: var(--flaeche); font: 800 clamp(.95rem, 4.2vw, 1.3rem)/1 var(--schrift); text-transform: uppercase; color: var(--text); -webkit-user-select: none; user-select: none; }
.s-amtswort-zeile.aktiv .s-amtswort-feld { border-color: var(--linie2); border-style: dashed; }
.s-amtswort-feld.voll { border-style: solid; border-color: var(--leise); }
.s-amtswort-feld.g { background: var(--gruen); border-color: var(--gruen); color: #fff; }
.s-amtswort-feld.y { background: var(--gold); border-color: var(--gold); color: #fff; }
.s-amtswort-feld.x { background: var(--flaeche3); border-color: var(--flaeche3); color: var(--leise); }
.s-amtswort-feld.stempel { animation: s-amtswort-stempel .35s var(--kurve) backwards; }
@keyframes s-amtswort-stempel { 0% { transform: scale(1.3) rotate(-8deg); opacity: .3; } 70% { transform: scale(.96) rotate(1deg); opacity: 1; } 100% { transform: none; } }
.s-amtswort-zeile.wackelt { animation: s-amtswort-wackeln .35s ease-in-out; }
@keyframes s-amtswort-wackeln { 0%, 100% { translate: 0 0; } 20%, 60% { translate: -5px 0; } 40%, 80% { translate: 5px 0; } }
.s-amtswort-stand { text-align: center; margin: 4px 0 8px; min-height: 1.3em; }
.s-amtswort-legende { padding: 0 5px; border-radius: 3px; color: #fff; } .s-amtswort-legende.g { background: var(--gruen); } .s-amtswort-legende.y { background: var(--gold); } .s-amtswort-legende.x { background: var(--flaeche3); color: var(--text); }
.s-amtswort-tastatur { display: grid; gap: 6px; margin-top: 12px; touch-action: manipulation; }
.s-amtswort-reihe { display: flex; gap: 4px; justify-content: center; }
.s-amtswort-taste { flex: 1 1 0; min-width: 0; max-width: 46px; min-height: 54px; padding: 0; border: 1px solid var(--linie2); border-radius: 8px; background: var(--flaeche2); color: var(--text); font: 700 1.05rem var(--schrift); cursor: pointer; -webkit-tap-highlight-color: transparent; -webkit-user-select: none; user-select: none; transition: background var(--dauer), transform .06s; }
.s-amtswort-taste:active:not([disabled]) { transform: scale(.94); }
.s-amtswort-taste.loeschen, .s-amtswort-taste.pruefen { flex: 1.7 1 0; max-width: 84px; font-size: .9rem; }
.s-amtswort-taste.pruefen { background: var(--akzent); border-color: var(--akzent); color: #fff; }
.s-amtswort-taste.g { background: var(--gruen); border-color: var(--gruen); color: #fff; }
.s-amtswort-taste.y { background: var(--gold); border-color: var(--gold); color: #fff; }
.s-amtswort-taste.x { background: var(--flaeche3); border-color: var(--flaeche3); color: var(--leise); }
.s-amtswort-taste[disabled] { opacity: .5; cursor: default; }
.s-amtswort-tastatur.gesperrt { opacity: .7; }
.s-amtswort-ergebnis { margin: 10px auto 4px; padding: 12px 14px; border-radius: var(--radius-k); background: var(--flaeche2); text-align: center; animation: aufploppen .4s var(--kurve) backwards; }
.s-amtswort-kopf { margin: 0 0 4px; font-weight: 700; } .s-amtswort-kopf.gut { color: var(--gruen-text); }
.s-amtswort-wort { margin: 0; font: 800 1.5rem/1.2 var(--schrift); letter-spacing: .12em; }
.s-amtswort-erkl { margin: 8px 0 0; }
.s-amtswort-belohnung { margin: 6px 0 0; color: var(--gruen-text); }
.s-amtswort-ergebnis .teilen-text { text-align: left; }
.s-amtswort-hinweis { padding: 8px 12px; border-left: 3px solid var(--akzent); background: var(--akzent-hell); border-radius: 0 var(--radius-k) var(--radius-k) 0; }
@media (prefers-reduced-motion: reduce) { .s-amtswort-feld.stempel, .s-amtswort-zeile.wackelt, .s-amtswort-ergebnis { animation: none; } }
@media (min-width: 480px) { .s-amtswort-taste { min-height: 58px; } }
