/* WortwuchsWabe: a sunny meadow, a generous hive, and a visible next goal. */
.page-id-editorial-spiele-woerter-bilden{background-color:#f2f7e9;background-image:linear-gradient(#f8fbf6e8,#f8fbf6d9),url('/assets/games/wabe-fruehlingswiese.webp');background-size:cover;background-position:center top;background-attachment:fixed}
.page-id-editorial-spiele-woerter-bilden .ww-breadcrumb{display:none}
.page-id-editorial-spiele-woerter-bilden .ww-layout{display:block;max-width:1240px;margin:24px auto 45px}
.page-id-editorial-spiele-woerter-bilden .ww-article{padding:23px 28px 35px;background:#ffffffed;border-color:#e0e8d6}
.page-id-editorial-spiele-woerter-bilden .ww-article>h1{display:block!important;width:auto!important;background:none!important;box-shadow:none!important;border:0!important;padding:0!important;margin:0 0 14px;font-size:clamp(27px,4vw,36px);line-height:1.2;color:#2f5664}
.page-id-editorial-spiele-woerter-bilden .ww-article>h1:before,
.page-id-editorial-spiele-woerter-bilden .ww-article>h1:after{display:none!important}
.wg-welcome{position:relative;isolation:isolate;min-height:190px;padding:20px 30px;margin:0 0 22px;border:1px solid #dae6c9;border-radius:22px;overflow:hidden;background:#f1f7e6 url('/assets/games/wabe-fruehlingswiese.webp') center 60%/cover no-repeat}
.wg-welcome:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#fffdf3f2 0%,#fffdf3cc 36%,#fffdf335 64%,transparent 85%)}
.wg-welcome-copy{position:relative;z-index:1;max-width:78%}
.ww-article .wg-tagline{margin:0 0 11px;color:#315b48;font-family:'Trebuchet MS',sans-serif;font-size:clamp(28px,3.9vw,38px);font-weight:700;line-height:1.08;letter-spacing:-.025em}
.ww-article .wg-welcome-text{font-size:14px;line-height:1.6;margin:0 0 13px;color:#456448}
.ww-article .wg-welcome-free{font-size:11px;font-weight:600;line-height:1.5;letter-spacing:.025em;color:#526b43;margin:0}
.wg-welcome-bees{position:absolute;right:18px;top:9px;width:155px;height:142px!important;object-fit:contain;filter:drop-shadow(0 4px 4px #6c78321a);pointer-events:none}
.wg-game{overflow:visible;border-radius:22px;background:#fffef8;scroll-margin-top:12px}
.wg-game-top{position:sticky;top:0;z-index:35;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:8px 25px;border-radius:22px 22px 0 0;background:#fff8e9f7;border-bottom:1px solid #e8ddbb;box-shadow:0 4px 12px #44572c0a;backdrop-filter:blur(8px)}
.wg-round-heading{display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-width:0}
.ww-article .wg-game-top h2{margin:0!important;font-size:22px;line-height:1.3;color:#31576a}
.wg-game-top .wg-eyebrow{font-size:10px;letter-spacing:.07em;color:#7a6b40}
.wg-stage-peek{width:216px;flex-shrink:0;display:flex;flex-direction:column;align-items:stretch;padding:5px 12px 6px;background:#ffffffd9;border:1px solid #eadfbf;border-radius:16px;color:#4b6548}
.wg-stage-pair{display:flex;justify-content:center;align-items:center;gap:12px;min-height:44px}
.wg-top-current,.wg-top-next{display:flex;flex-direction:column;align-items:center;gap:1px;min-width:0;max-width:82px;flex:1;font-size:10px;line-height:1.2;text-align:center}
.wg-top-current{font-weight:700;color:#345638}
.wg-top-current>img,.wg-next-portrait>img{display:block;width:31px;height:31px!important;max-width:none;border-radius:50%;background:#fff2bf;margin:0!important}
.wg-next-portrait{position:relative;display:block}.wg-next-portrait>img{filter:grayscale(.6);opacity:.65;background:#eef0e6}
.wg-stage-arrow{font-size:22px;color:#8a9c70;align-self:center}
.wg-lock{position:absolute;right:-5px;bottom:-1px;display:grid;place-items:center;width:19px;height:19px;border-radius:50%;background:#fffdf2;border:1px solid #d8cfae;color:#766542}
.wg-stage-peek progress{display:block;width:100%;height:5px;margin:5px 0;border:0;border-radius:5px;overflow:hidden;appearance:none;background:#e8eddd;color:#73995a}
.wg-stage-peek progress::-webkit-progress-bar{background:#e8eddd}
.wg-stage-peek progress::-webkit-progress-value{background:#7aa05c;transition:width .3s ease}
.wg-stage-peek progress::-moz-progress-bar{background:#7aa05c}
#wg-top-goal{text-align:center;font-size:11px;font-weight:600;line-height:1.4}
.wg-stage-peek:has(#wg-top-next-card[hidden]) .wg-stage-arrow{display:none}
.wg-game [hidden]{display:none!important}
.wg-play-layout{grid-template-columns:minmax(0,1.35fr) minmax(300px,.85fr);border-radius:0;overflow:hidden}
.wg-play-area{padding:22px 32px 26px;background:radial-gradient(ellipse at 50% 35%,#fff0b855,transparent 70%),#fffef9}
.ww-article .wg-hive-caption{font-size:13px;line-height:1.6;margin:0 0 5px}
.wg-letter-rack{width:min(100%,400px);height:auto;aspect-ratio:400/384;margin:0 auto}
.wg-letter,.wg-letter.wg-required,.wg-other-letters .wg-letter{width:32%;height:29.1667%;font-size:clamp(30px,4.8vw,44px);background:linear-gradient(145deg,#ffe692,#ffd260);color:#6a4a16}
.wg-letter.wg-required{left:34%;top:35.4167%;font-size:clamp(32px,5vw,46px);padding-bottom:14px;background:#007caf;color:#fff}
.wg-required-wrap>span{left:34%;top:55.4%;width:32%;font-size:10px}
.wg-other-letters .wg-letter:nth-child(1){left:34%;top:4.4271%}
.wg-other-letters .wg-letter:nth-child(2){left:60.25%;top:20.0521%}
.wg-other-letters .wg-letter:nth-child(3){left:60.25%;top:50.7813%}
.wg-other-letters .wg-letter:nth-child(4){left:34%;top:66.4063%}
.wg-other-letters .wg-letter:nth-child(5){left:7.75%;top:50.7813%}
.wg-other-letters .wg-letter:nth-child(6){left:7.75%;top:20.0521%}
.wg-letter:hover,.wg-other-letters .wg-letter:hover{background:#ffd064}.wg-letter.wg-required:hover{background:#00689b}
.wg-letter:focus-visible,.wg-other-letters .wg-letter:focus-visible{background:#284f63;color:white}
.wg-shuffle-row{justify-content:center;gap:0;margin:-3px 0 15px}
.wg-flower-button{min-height:50px;padding:0 15px 0 4px}
.wg-flower-button img{width:50px;height:50px}.wg-flower-button span{font-size:13px}
.wg-input-row input{height:54px;min-height:54px;padding-block:8px}
.wg-actions .wg-primary{min-height:48px;padding-block:11px}
.wg-progress{padding:25px 24px;background:#f3f8ee}
.wg-progress .wg-level-current{display:none}
.wg-levels span{font-size:10px;white-space:normal}
.wg-levels img{width:46px;height:46px}
.wg-more-play{display:block;padding:9px 22px 16px;text-align:center}
.wg-more-controls{display:flex;justify-content:center;flex-wrap:wrap;gap:4px 22px}
.ww-article #wg-other-help{margin:0;font-size:12px;line-height:1.6;color:#5e736a}
.wg-preferences{border-radius:0 0 22px 22px}
.ww-article .wg-shuffle-explainer{max-width:800px;margin:24px auto 0;padding:15px 19px;background:#f3f7eb;border:1px solid #e2e8d5;border-radius:12px;color:#57694a;font-size:13px;line-height:1.7}
.wg-prose{padding-top:0}
@media(max-width:850px){
  .wg-play-layout{grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr)}
  .wg-play-area{padding:20px}.wg-progress{padding:22px 16px}
}
@media(max-width:720px){
  .page-id-editorial-spiele-woerter-bilden .ww-layout{margin-top:16px}
  .page-id-editorial-spiele-woerter-bilden .ww-article{padding:19px 20px 28px}
  .wg-play-layout{grid-template-columns:minmax(0,1fr)}
  .wg-game-top{padding:10px 17px;gap:12px}
  .ww-article .wg-game-top h2{font-size:19px}
  .wg-stage-peek{width:190px}
  .wg-letter-rack{width:min(100%,370px)}
  .wg-progress{padding:23px 22px;border-left:0;border-top:1px solid #dfe6d7}
}
@media(max-width:540px){
  .page-id-editorial-spiele-woerter-bilden .ww-layout{padding:0 7px;margin-top:12px}
  .page-id-editorial-spiele-woerter-bilden .ww-article{padding:16px 13px 25px}
  .page-id-editorial-spiele-woerter-bilden .ww-article>h1{font-size:27px;margin-bottom:12px}
  .wg-welcome{min-height:164px;padding:17px 16px 15px;margin:0 -5px 16px;border-radius:17px;background-position:64% center}
  .wg-welcome:before{background:linear-gradient(90deg,#fffdf3ed,#fffdf3b0 53%,#fffdf315)}
  .wg-welcome-copy{max-width:100%}.ww-article .wg-tagline{font-size:29px;max-width:245px;margin-bottom:10px}
  .ww-article .wg-welcome-text{font-size:12px;max-width:245px;margin-bottom:10px}.ww-article .wg-welcome-text br{display:none}
  .ww-article .wg-welcome-free{font-size:9px;letter-spacing:0}
  .wg-welcome-bees{width:78px;height:72px!important;right:3px;top:8px;z-index:0}
  .wg-game{margin-inline:-7px;border-radius:17px}
  .wg-game-top{padding:8px 10px;gap:8px;border-radius:17px 17px 0 0}
  .wg-round-heading{flex:1;gap:4px}.ww-article .wg-game-top h2{font-size:16px}
  .wg-game-top .wg-eyebrow{font-size:9px;letter-spacing:.04em}
  .wg-stage-peek{width:154px;padding:5px 7px 6px;border-radius:12px}
  .wg-stage-pair{gap:5px;min-height:49px}.wg-top-current,.wg-top-next{font-size:9px}
  .wg-top-current>img,.wg-next-portrait>img{width:31px;height:31px!important}
  .wg-stage-arrow{font-size:18px}.wg-lock{width:17px;height:17px;right:-4px}
  #wg-top-goal{font-size:10px;line-height:1.35}.wg-stage-peek progress{margin:4px 0}
  .wg-play-area{padding:10px 12px 14px}.wg-letter-rack{width:min(100%,280px);max-width:280px}
  .wg-letter,.wg-letter.wg-required,.wg-other-letters .wg-letter{font-size:34px}
  .wg-letter.wg-required{font-size:37px;padding-bottom:12px}.wg-required-wrap>span{font-size:9px;top:55%}
  .wg-shuffle-row{margin:0 0 6px}.wg-flower-button{min-height:44px}.wg-flower-button img{width:42px;height:42px}
  .wg-input-row input{height:48px;min-height:48px}
  .ww-article #wg-input-help{margin:5px 0 8px;font-size:11px}
  .wg-actions .wg-primary{min-height:44px;padding-block:9px}
  .wg-message{min-height:0;margin:8px 0;padding:8px 10px;line-height:1.5}
  .wg-bonus{padding:8px 10px}.wg-bonus-row{gap:9px}
  .wg-progress{padding:23px 14px}.ww-article #wg-other-help{font-size:11px}
  .ww-article .wg-shuffle-explainer{font-size:12px;padding:13px 15px}
}
@media(max-width:360px){
  .wg-stage-peek{width:143px}.ww-article .wg-game-top h2{font-size:14px}
  .wg-welcome-bees{width:61px;height:56px!important;top:7px;right:2px}
  .ww-article .wg-tagline{font-size:26px;max-width:222px}
  .ww-article .wg-welcome-text{max-width:235px;font-size:11px}
  .wg-letter,.wg-letter.wg-required,.wg-other-letters .wg-letter{font-size:30px}
  .wg-letter.wg-required{font-size:33px}.wg-required-wrap>span{font-size:8px}
  .wg-play-area{padding-inline:9px}
}
/* Short phone screens keep the hint button within the compact play area. */
@media(max-width:540px) and (max-height:760px){
  .wg-letter-rack{width:min(100%,224px)}
  .wg-stage-peek{padding-block:3px}.wg-stage-pair{min-height:39px}
  .wg-top-current>img,.wg-next-portrait>img{width:27px;height:27px!important}
  .wg-stage-peek progress{margin-block:3px}
  .wg-letter,.wg-letter.wg-required,.wg-other-letters .wg-letter{font-size:29px}
  .wg-letter.wg-required{font-size:32px;padding-bottom:10px}
  .wg-required-wrap>span{font-size:8px}
}
@media(prefers-reduced-motion:reduce){.wg-stage-peek progress::-webkit-progress-value{transition:none}}
@media print{.wg-welcome-bees,.wg-welcome:before{display:none}.wg-welcome{background:none;min-height:0}.page-id-editorial-spiele-woerter-bilden{background:white}}
