/* WortSpielen.de — Wort-Twist (worttwist.js): Text Twist, Word Connect / Word Cookies, Jumble. The .wt-* rules of the
   WordGames.club wu.css; colours, fonts and the generic .pdd rules come from de.css and site.css (--w-acc, --w-acc-ink).
   Changes: text on the accent colour uses --wt-ink (the site's --w-acc-ink), as the site accent is light green in dark mode;
   the Jumble cursor cell is tinted with the accent instead of a fixed orange. */
.wt{max-width:620px;min-height:0;--wt-acc:var(--w-acc,#d9532a);--wt-ink:var(--w-acc-ink,#fff);--wt-ok:#2f9e5b;--wt-cell:#fff;--wt-cellb:#d8d2c4;--wt-wheel:#f3eee4;--wt-tile:#fff6e6;--wt-tileb:#e2d4b4}
html.pdd-dark .wt{--wt-cell:#262629;--wt-cellb:#46464a;--wt-wheel:#2a2926;--wt-tile:#34322c;--wt-tileb:#4b4638}
.wt-bar{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center;margin:4px auto 10px}
.wt select{font:inherit;font-weight:700;padding:8px 10px;border-radius:10px;border:1px solid var(--tb);background:var(--gbg);color:var(--gfg)}
.wt-chip{display:inline-block;padding:6px 12px;border-radius:999px;background:var(--kbg);color:var(--kfg);font-weight:700;font-size:14.5px;white-space:nowrap}
.wt-strong{background:var(--gfg);color:var(--gbg)}
.wt-dim{background:transparent;color:var(--mut);border:1px solid var(--line)}
.wt-clock{font-variant-numeric:tabular-nums;font-weight:900;font-size:20px;min-width:62px;text-align:center;padding:4px 10px;border-radius:10px;background:var(--kbg);color:var(--kfg)}
.wt-clock.wt-low{background:#e05252;color:#fff}
.wt-btn{border:0;border-radius:999px;padding:10px 18px;font:inherit;font-weight:800;cursor:pointer;background:var(--wt-acc);color:var(--wt-ink);line-height:1.1}
.wt-btn:hover{filter:brightness(1.05)}
.wt-btn.wt-ghost{background:var(--gbg);color:var(--gfg);border:1px solid var(--tb)}
.wt-btn.wt-go{background:var(--gfg);color:var(--gbg)}
.wt-btn.wt-small{padding:7px 13px;font-size:14px}
.wt-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:8px 0}
.wt-row{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:10px}
.wt-msg{min-height:34px;display:flex;align-items:center;justify-content:center;font-weight:800;text-align:center}
.wt-msg.ok,.wt-msg.bad,.wt-msg.old,.wt-msg.big{padding:4px 14px;border-radius:999px;width:max-content;max-width:100%;margin:0 auto}
.wt-msg.ok{background:#e3f4e8;color:#1f7a45}.wt-msg.bad{background:#1d2433;color:#fff}.wt-msg.old{background:var(--kbg);color:var(--kfg)}
.wt-msg.big{background:var(--wt-acc);color:var(--wt-ink)}
.wt-help{text-align:center;color:var(--mut);font-size:14px;margin:6px auto 0;max-width:480px}
.wt-note{color:var(--mut);font-size:14.5px;margin:6px 0}
.wt-end{margin:14px auto 0;text-align:center;border-top:2px solid var(--line);padding-top:12px}
.wt-end h3{margin:0 0 6px;font-size:21px}
.wt-shake{animation:wt-shake .4s}
@keyframes wt-shake{20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}

/* Text Twist */
.wt-slots{display:grid;grid-template-columns:repeat(var(--wt-cols,2),max-content);justify-content:center;gap:6px 18px;margin:0 auto 6px;padding:10px;border-radius:14px;background:var(--wt-wheel)}
.wt-slot{display:flex;gap:2px}
.wt-slot span{width:19px;height:21px;border-radius:4px;background:var(--wt-cell);border:1px solid var(--wt-cellb);display:grid;place-items:center;font-weight:800;font-size:13px;line-height:1}
.wt-slot.got span{background:var(--wt-ok);border-color:var(--wt-ok);color:#fff;animation:wt-pop .3s}
.wt-slot.miss span{color:var(--mut);background:transparent}
.wt-inrow{display:flex;gap:6px;justify-content:center;margin:4px 0 10px;min-height:48px}
.wt-in{width:44px;height:48px;border-radius:10px;border:2px dashed var(--tb);background:transparent;color:var(--gfg);font:inherit;font-weight:900;font-size:24px;padding:0;cursor:default}
.wt-in.on{border:2px solid var(--wt-acc);background:var(--wt-tile);cursor:pointer}
.wt-rack{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}
.wt-tile{position:relative;width:52px;height:56px;border-radius:12px;border:0;background:var(--wt-tile);box-shadow:inset 0 -4px 0 var(--wt-tileb),0 2px 5px rgba(0,0,0,.12);color:var(--gfg);font:inherit;cursor:pointer;padding:0;transition:transform .1s,opacity .1s}
.wt-tile b{font-size:28px;font-weight:900}
.wt-tile small{position:absolute;right:6px;bottom:7px;font-size:11px;font-weight:800;color:var(--mut)}
.wt-tile:hover{transform:translateY(-2px)}
.wt-tile.used{opacity:.25;transform:scale(.92)}
.wt-bonus{text-align:center;color:var(--mut);font-size:14px;min-height:20px}
@media (max-width:420px){.wt-tile{width:44px;height:50px}.wt-tile b{font-size:24px}.wt-in{width:38px;height:44px;font-size:21px}.wt-slot span{width:16px;height:19px;font-size:11.5px}.wt-slots{gap:5px 10px;padding:8px}}

/* Word Connect / Word Cookies */
.wt-cw{display:grid;gap:var(--g,4px);justify-content:center;margin:2px auto 4px;transition:transform .3s}
.wt-cc{width:var(--s,40px);height:var(--s,40px);border-radius:calc(var(--s,40px)*.18);background:var(--wt-cell);border:1.5px solid var(--wt-cellb);display:grid;place-items:center}
.wt-cc span{font-weight:900;font-size:calc(var(--s,40px)*.56);line-height:1;text-transform:uppercase}
.wt-cc.on{background:var(--wt-acc);border-color:var(--wt-acc);color:var(--wt-ink)}
.wt-cc.hint{background:var(--wt-cell);color:var(--wt-acc);border-color:var(--wt-acc)}
.wt-cc.pop{animation:wt-pop .35s}
@keyframes wt-pop{50%{transform:scale(1.18)}}
.wt-cw.wt-won{animation:wt-pop .6s}
.wt-word{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;margin:2px 0 4px}
.wt-cur{display:inline-block;padding:6px 16px;border-radius:12px;background:var(--wt-acc);color:var(--wt-ink);font-weight:900;font-size:24px;letter-spacing:.08em}
.wt-word .wt-ok,.wt-word .wt-x{width:40px;height:40px;padding:0;border-radius:50%;font-size:18px}
.wt-word .wt-ok{background:var(--wt-ok)}
.wt-word .wt-x{background:var(--gbg);color:var(--gfg);border:1px solid var(--tb)}
.wt-play{display:flex;align-items:center;justify-content:center;gap:12px}
.wt-round{position:relative;width:48px;height:48px;padding:0;border-radius:50%;font-size:21px;flex-shrink:0}
.wt-badge{position:absolute;right:-4px;top:-4px;min-width:20px;height:20px;border-radius:999px;background:var(--wt-acc);color:var(--wt-ink);font-style:normal;font-size:12px;font-weight:900;display:grid;place-items:center;padding:0 5px}
.wt-wheel{position:relative;width:min(250px,62vw);aspect-ratio:1;border-radius:50%;background:var(--wt-wheel);touch-action:none;flex-shrink:0;box-shadow:inset 0 0 0 1px var(--line)}
.wt-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.wt-lines polyline{fill:none;stroke:var(--wt-acc);stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;opacity:.75}
.wt-l{position:absolute;width:var(--ls,25%);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:clamp(22px,7vw,32px);color:var(--gfg);cursor:pointer;transition:background .1s,color .1s}
.wt-l.on{background:var(--wt-acc);color:var(--wt-ink)}
/* cookie: the letters sit on a baked cookie */
.wt-skin-cookie .wt-wheel{background:radial-gradient(circle at 30% 28%,rgba(92,55,24,.35) 0 3%,transparent 3.6%),radial-gradient(circle at 70% 76%,rgba(92,55,24,.35) 0 3.4%,transparent 4%),radial-gradient(circle at 76% 30%,rgba(92,55,24,.3) 0 2.6%,transparent 3.2%),radial-gradient(circle at 26% 72%,rgba(92,55,24,.3) 0 2.8%,transparent 3.4%),#e9b872;box-shadow:inset 0 -8px 0 rgba(150,90,30,.35),0 6px 16px -8px rgba(0,0,0,.4)}
.wt-skin-cookie .wt-l{color:#4a2a10}
.wt-skin-cookie .wt-l.on{background:#fff6e6;color:#4a2a10;box-shadow:0 0 0 3px #b8712d}
.wt-skin-cookie .wt-lines polyline{stroke:#fff6e6;opacity:.95}
/* pan: the letters are in a frying pan */
.wt-skin-pan .wt-wheel{background:radial-gradient(circle,#4a4d55 0 62%,#2e3036 63% 70%,#595c64 71%);box-shadow:0 6px 16px -8px rgba(0,0,0,.5)}
.wt-skin-pan .wt-l{color:#fff}
.wt-skin-pan .wt-l.on{background:#f5d76e;color:#1d2433}
.wt-skin-pan .wt-lines polyline{stroke:#f5d76e;opacity:.9}
@media (max-width:420px){.wt-play{gap:8px}.wt-round{width:42px;height:42px;font-size:18px}}

/* Jumble */
.wt-day{text-align:center;font-weight:700;color:var(--mut);font-size:14px;margin-bottom:6px}
.wt-jrows{display:flex;flex-direction:column;gap:10px;margin:0 auto;max-width:560px}
.wt-jrow{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;padding:10px 8px;border-radius:14px;border:2px solid transparent;background:var(--wt-wheel);cursor:pointer}
.wt-jrow.act{border-color:var(--wt-acc)}
.wt-jrow.ok{background:#e3f4e8}
html.pdd-dark .wt-jrow.ok{background:#1f3b2a}
.wt-jrow.wait{opacity:.6}
.wt-jfinal{flex-direction:column;background:transparent;border:2px dashed var(--tb)}
.wt-jfinal.act{border:2px solid var(--wt-acc)}
.wt-jcap{font-weight:800;font-size:14px;color:var(--mut);text-transform:uppercase;letter-spacing:.05em}
.wt-jscr{display:flex;gap:4px}
.wt-jt{width:38px;height:42px;border:0;border-radius:9px;background:var(--wt-tile);box-shadow:inset 0 -3px 0 var(--wt-tileb);color:var(--gfg);font:inherit;font-weight:900;font-size:21px;padding:0;cursor:pointer}
.wt-jt.used{opacity:.25}
.wt-jarrow{color:var(--mut);font-weight:900}
.wt-jans{display:flex;gap:4px}
.wt-jb{width:34px;height:38px;border-bottom:3px solid var(--gfg);display:grid;place-items:center;font-weight:900;font-size:21px;position:relative}
.wt-jb.circ:before{content:"";position:absolute;inset:1px 0 3px;border:2px solid var(--wt-acc);border-radius:50%}
.wt-jb.cur{border-bottom-color:var(--wt-acc);background:rgba(217,83,42,.08);background:color-mix(in srgb,var(--wt-acc) 10%,transparent)}
.wt-jrow.ok .wt-jb{color:#1f7a45}
@media (max-width:460px){.wt-jt{width:31px;height:36px;font-size:18px}.wt-jb{width:28px;height:33px;font-size:18px}.wt-jrow{gap:6px}.wt-jarrow{display:none}}

/* 25.09 (PageSpeed, CLS): the word slots and the small crossword keep a typical height until the puzzle has loaded */
.wt-n7 .wt-slots:empty{min-height:250px}
.wt-n6 .wt-slots:empty{min-height:200px}
.wt-cw:empty{min-height:146px}