/* Game Lab: Sentence Fill-In. Uses the Sentence Scramble's notebook look (lab-scramble.css) plus these pieces. */
.lf .ls-paper { justify-content: flex-start; padding-top: 2.2rem; }
.lf-sentence { margin: 0 0 1.6rem; font-family: 'DX Letters', 'Andika', sans-serif; font-weight: 700; font-size: clamp(1.6rem, 1.1rem + 2.2vw, 2.7rem); line-height: 1.9; color: #1c2b3d; text-align: center; }
.lf-blank { display: inline-block; min-width: 3.2em; height: 1.2em; margin: 0 .15em; vertical-align: -.15em; border-radius: 12px; border: 3px dashed #9fb4c9; background: rgba(175,205,239,.2); line-height: 1.1; padding: 0 .2em; transition: background .2s; }
.lf-blank.is-over { background: rgba(242,176,30,.25); border-color: #f2b01e; }
.lf-blank.is-filled { min-width: 0; height: auto; border: 3px solid #2fa36b; background: #bfeccf; color: #1f7a4a; animation: lf-pop .35s cubic-bezier(.34,1.56,.64,1); }
.lf-bank { display: flex; flex-wrap: wrap; justify-content: center; gap: clamp(10px, 2vw, 22px); }
.lf-word { position: relative; font-family: 'DX Letters', 'Andika', sans-serif; font-weight: 700; font-size: clamp(1.4rem, 1rem + 1.8vw, 2.3rem); line-height: 1.1; color: #1c2b3d; min-width: 5em;
	padding: .45em .8em .5em; border-radius: 16px 14px 17px 13px; border: 3px solid #26324a; background: linear-gradient(180deg, #fff 0%, #fff6d9 100%); box-shadow: 0 5px 0 #26324a, 0 8px 14px rgba(0,0,0,.12); cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none; }
.lf-word:hover { transform: translateY(-3px); }
.lf-word:focus-visible { outline: 3px solid #fff; box-shadow: 0 0 0 6px #17706f, 0 5px 0 #26324a; }
.lf-word.is-lifted { opacity: .35; }
.lf-word--ghost { position: fixed; z-index: 99999; pointer-events: none; transform: rotate(-3deg) scale(1.06); }
.lf-word.is-right { background: linear-gradient(180deg, #e9fbf1, #bfeccf); border-color: #1f7a4a; box-shadow: 0 5px 0 #1f7a4a; }
.lf-word.is-wrong { background: #ffd9d4; border-color: #c23b3b; box-shadow: 0 5px 0 #c23b3b; }
.lf-mark { position: absolute; top: -14px; right: -10px; width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; border: 3px solid #fff; color: #fff; font-family: system-ui, sans-serif; font-size: 1.2rem; font-weight: 900; box-shadow: 0 3px 8px rgba(0,0,0,.3); animation: lf-pop .4s cubic-bezier(.34,1.56,.64,1); }
.lf-mark--right { background: #2fa36b; } .lf-mark--wrong { background: #d64545; }
.lf-stars { margin: .2rem 0 0; font-size: 2.2rem; color: #f2b01e; letter-spacing: .1em; }
.lf-score { min-width: 3em; text-align: right; font-weight: 800; color: #1f7a4a; }
@keyframes lf-pop { 0% { transform: scale(.5); } 100% { transform: scale(1); } }
@media (max-width: 640px) { .lf-sentence { font-size: 1.45rem; line-height: 1.8; } .lf-word { min-width: 4em; font-size: 1.3rem; } }
