.first-pieces{box-sizing:border-box;width:min(540px,calc(100vw - 20px));max-height:calc(100dvh - 20px);overflow:auto;border:2px solid #ded3e9;border-radius:24px;padding:18px;background:#fffaf1;color:#2d1945;box-shadow:0 12px 60px #24133355;font-family:inherit}.first-pieces::backdrop{background:#261a35bb}.first-pieces header{display:flex;align-items:center;justify-content:space-between;gap:10px}.first-pieces h2{font-size:22px;margin:0}.first-pieces header span{white-space:nowrap}.fp-prompt{margin:12px 0;font-size:16px}.fp-board{position:relative;width:100%;border-radius:12px;background:#f1e5d3;overflow:hidden;box-shadow:inset 0 0 0 2px #d2b795}.fp-board>svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.fp-board .fp-example{opacity:.35}.fp-target{position:absolute;width:50%;height:50%;min-width:44px;min-height:44px;border:1px dashed #876d5555;border-radius:0;background:transparent;z-index:1;padding:0;box-shadow:none}.fp-target:focus-visible{outline:4px solid #713f98;outline-offset:-4px}.fp-feedback{min-height:24px;margin:8px 0;font-size:16px}.fp-tray{display:flex;justify-content:center;gap:18px;min-height:94px}.fp-piece{width:112px;height:94px;min-width:48px;border:2px solid transparent;border-radius:16px;background:#f1e7fc;touch-action:none;padding:3px}.fp-piece>svg{width:100%;height:100%;pointer-events:none}.fp-piece[aria-pressed=true]{border-color:#713f98;background:#ead9ff}.first-pieces footer{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.first-pieces footer button{min-height:48px;padding:10px 14px;font:inherit;border:1px solid #cdbdda;border-radius:16px;background:white;color:#2d1945}.first-pieces .fp-primary{background:#6b3d9c;color:white;margin-left:auto}.first-pieces button:disabled{opacity:.45}.fp-drag{position:fixed;z-index:10;width:125px;height:110px;transform:translate(-50%,-50%);pointer-events:none;filter:drop-shadow(0 5px 5px #26163355)}@media(max-height:600px){.first-pieces{width:min(420px,calc(100vw - 20px))}.fp-board{max-width:260px;margin:auto}.fp-tray{min-height:65px}.fp-piece{height:65px;width:80px}.first-pieces h2{font-size:19px}.fp-prompt,.fp-feedback{margin:5px 0}}

body[data-kd-game="puzzle"] .first-pieces footer button{min-height:48px!important}.fp-piece{position:relative}.fp-board .fp-example{animation:fp-show 2.6s ease-in-out both}.fp-board .fp-effect{z-index:2;fill:none;stroke-width:7;pointer-events:none}.fp-right{stroke:#479267;animation:fp-feedback 1.1s ease-in-out both}.fp-wrong{stroke:#aa6534;animation:fp-feedback 1.8s ease-in-out both}.fp-attempt{stroke-dasharray:12 8;stroke:#72529d}.fp-cue{position:absolute;right:2px;top:0;font:700 26px/1 sans-serif;color:#aa6534;animation:fp-feedback 1.8s ease-in-out both;pointer-events:none}@keyframes fp-show{0%{transform:translateY(75%);opacity:0}20%{opacity:.65}60%,80%{transform:translateY(0);opacity:.4}100%{transform:translateY(0);opacity:0}}@keyframes fp-feedback{0%,100%{opacity:0}25%,70%{opacity:1}}@media(prefers-reduced-motion:reduce){.fp-board .fp-example{animation-name:fp-feedback;transform:none}}
