/* assets/wurfeingabe.css — DIE WURFEINGABE (T2, 11.10.2026).
   Herausgeloest aus board.html (X01): die Regeln fuer Eingabefeld, Vorschau, Schnellwahl,
   obere Reihe, Ziffernblock, Feld-Eingabe und Umschalter - wortgleich, nur an einem Ort.
   Die Farben kommen aus den Token der Seite (--key-bg, --key-text, --panel, --panel-text; in der
   Spiel-Welt setzt assets/theme-game.css sie auf --game-key-* und --game-surface-*). Die Dichte-
   stufen (#app.c1/.c2/.c3) und seitenspezifische Tasten (X01 "check", ".clear") bleiben in der
   Seite. Markup: assets/wurfeingabe.js (DHEingabe). */

/* Steuerung: Schnellwahl links, Eingabe rechts */
.controls{display:flex; gap:14px; align-items:flex-start; margin-top:5px;}
.quick-col{flex:1; min-width:0;}
.input-col{flex:1; min-width:0; display:flex; flex-direction:column; gap:7px;}

.quick{display:grid; grid-template-columns:repeat(3,1fr); gap:7px;}
.quick button{background:var(--key-bg); color:var(--key-text); border:none; border-radius:3px;
     --kfs:26px; --kmax:6.4vw; padding:0; min-height:66px;
     font-size:min(var(--kfs), var(--kmax)); font-weight:800; line-height:1.1;}

.entry{background:#2c2c2c; border:1px solid #555; border-radius:5px; text-align:center;
     font-size:39px; font-weight:800; padding:9px; min-height:62px; letter-spacing:2px;}
.entry.empty{color:#777;}
.entry-preview{text-align:center; font-size:15px; font-weight:700; min-height:19px; margin:-2px 0 6px; color:#8a8f98; line-height:1.2;}
.entry-preview.pv-ok{color:#7fd88a;}
.entry-preview.pv-finish{color:#ffd24a;}
.entry-preview.pv-bust{color:#ff6b6b;}
.entry-preview.pv-bad{color:#ffab5c; font-weight:600; font-size:13px;}

.toprow{display:grid; grid-template-columns:repeat(4,1fr); gap:7px;}
.pad{display:grid; grid-template-columns:repeat(4,1fr); gap:7px;}
.pad button[data-k="1"]{grid-column:1; grid-row:1;}
.pad button[data-k="2"]{grid-column:2; grid-row:1;}
.pad button[data-k="3"]{grid-column:3; grid-row:1;}
.pad button[data-k="4"]{grid-column:1; grid-row:2;}
.pad button[data-k="5"]{grid-column:2; grid-row:2;}
.pad button[data-k="6"]{grid-column:3; grid-row:2;}
.pad button[data-k="B"]{grid-column:4; grid-row:2;}
.pad button[data-k="7"]{grid-column:1; grid-row:3;}
.pad button[data-k="8"]{grid-column:2; grid-row:3;}
.pad button[data-k="9"]{grid-column:3; grid-row:3;}
.pad button[data-k="OK"]{grid-column:4; grid-row:3;}
.pad button[data-k="0"]{grid-column:2; grid-row:4;}
button.cell{background:var(--key-bg); color:var(--key-text); border:none; border-radius:3px;
     --kfs:30px; padding:0; min-height:71px; font-size:var(--kfs); font-weight:800; line-height:1.1;}
/* Wort-Beschriftungen leiten ihre Groesse aus --kfs ab und bekommen zusaetzlich
   eine breitenabhaengige Obergrenze, damit sie auf schmalen Geraeten weder
   abgeschnitten werden noch die Tastengeometrie sprengen. */
button.k-word{font-size:min(var(--kfs), var(--kmax, 100vw));}
.toprow button.k-word{white-space:nowrap;}
.quick button.k-word{--kmax:4.4vw; font-size:min(var(--kfs), var(--kmax), var(--kwrap));
     --kwrap:30px;}
.pad button.k-word{--kmax:9vw;}        /* "ok"        */

/* Modus und Feld-Eingabe */
.kbmode{margin:0 0 6px; text-align:center; font-size:12px; letter-spacing:.03em;
  color:#cfcfcf; background:#2c2c2c; border:1px solid #555; border-radius:5px; padding:5px 8px; user-select:none;}
.kbmode .sw{color:#8a8a8a; font-size:11px;}
.kbmode.field{color:#37d36a; border-color:#2e7d32;}
.kbtoggle{display:block; width:100%; margin:8px 0 0; background:#454545; color:#cfcfcf; border:1px solid #555; border-radius:6px; padding:8px; font-size:13px; font-weight:700;}
#kbWrap.field-on .entry, #kbWrap.field-on .controls{display:none;}
.fieldkb{display:none;}
#kbWrap.field-on .fieldkb{display:block;}
.fk-visit{background:#2c2c2c; border:1px solid #555; border-radius:5px; min-height:46px; padding:7px 9px; margin-bottom:7px; color:#eee; font-size:15px;}
.fk-visit .fk-empty{color:#8a8a8a;}
.fk-line{line-height:1.55;} .fk-line b{color:#fff;}
.fk-line.fk-tot{margin-top:3px; border-top:1px solid #4a4a4a; padding-top:3px; font-size:17px;}
.fk-mult{display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-bottom:7px;}
.fk-mult button{background:#3a3a3a; color:#fff; border:1px solid #555; border-radius:4px; padding:12px 0; font-size:20px; font-weight:700;}
.fk-mult button.sel{background:#1769ff; border-color:#1769ff;}
.fk-nums{display:grid; grid-template-columns:repeat(5,1fr); gap:7px;}
.fk-special{display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-top:7px;}
.fk-nums button, .fk-special button{background:var(--panel); color:var(--panel-text); border:none; border-radius:4px; padding:14px 0; font-size:19px; font-weight:600;}
.fk-special button.fk-25{background:#155e2b; color:#fff;}
.fk-special button.fk-bull{background:#7a1320; color:#fff;}
.fk-special button.fk-miss{background:#555; color:#fff;}
/* EIN-01 E0: ein Feld, das das Spiel nicht erlaubt (opt.erlaubt) */
.fieldkb button.aus, .fieldkb button:disabled{opacity:.25; cursor:default;}
.fk-actions{display:grid; grid-template-columns:1fr 1fr 1.2fr; gap:7px; margin-top:7px;}
.fk-actions button{border:none; border-radius:4px; padding:14px 0; font-size:16px; font-weight:700; color:#fff;}
.fk-del{background:#6f6f6f;} .fk-clear{background:#8a3b1e;} .fk-ok{background:#1f9d3a;}

/* Feld-Eingabe: einzeilige Aufnahme-Anzeige mit klickbaren Slots */
.fk-row{display:flex; align-items:center; flex-wrap:wrap; gap:6px; font-size:18px;}
.fk-slot{background:#3a3a3a; border:1px solid #555; border-radius:4px; padding:4px 9px; color:#fff; cursor:pointer; min-width:30px; text-align:center;}
.fk-slot small{color:#bdbdbd; font-size:12px; margin-left:2px;}
.fk-slot.empty{color:#777; background:transparent; border-style:dashed; cursor:default; padding:4px 12px;}
.fk-slot.cur{border-color:#1769ff; box-shadow:0 0 0 1px #1769ff inset;}
.fk-sep{color:#777;} .fk-eq{color:#999; margin:0 2px;}
.fk-total{font-weight:800; color:#fff; font-size:20px; margin-left:2px;}
