:root{--line: #527b70;--gold: #f4c85d;--mint: #8ff7dc;--muted: #bfd3ca}*{box-sizing:border-box}html,body{min-width:320px;min-height:100%;margin:0;font-family:system-ui,sans-serif}body{color:#f7fbf8}button,select{font:inherit}button{cursor:pointer}button:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #9cfaff;outline-offset:3px}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.main-group{width:min(100%,var(--wp-main-width, 920px));margin-inline:auto}.main-screen,.main-hero,.main-copy{min-width:0}.main-copy p{margin:0;overflow-wrap:anywhere}.battle-workspace{position:relative;display:grid;grid-template-rows:minmax(36px,auto) minmax(0,1fr) minmax(52px,auto);gap:8px;min-width:0;min-height:0;padding:8px 12px}.objective-bar{display:grid;place-items:center;min-width:0;min-height:36px;padding:4px 12px;border:1px solid rgb(156 250 255 / 36%);border-radius:12px;background:linear-gradient(120deg,#103e4e,#061926);color:#f9e9b4;font-size:14px;font-weight:800;text-align:center}.puzzle-board{position:relative;align-self:stretch;justify-self:center;width:min(100%,820px);min-width:0;min-height:0;overflow:hidden;border:8px solid transparent;border-image:url(../../assets/animal-screw-workshop-wood-texture.webp) 90 round;border-radius:24px;background:linear-gradient(#2b190a6b,#28180a85),url(../../assets/animal-screw-workshop-wood-texture.webp) center / 280px auto;box-shadow:inset 0 0 35px #1f0f07,0 18px 36px #05110c;isolation:isolate;touch-action:manipulation}.plate{position:absolute;z-index:var(--z);left:var(--x);top:var(--y);width:var(--w);height:var(--h);transform:rotate(var(--r));border:4px solid color-mix(in srgb,var(--plate-color),#43240e 42%);background-color:var(--plate-color);background-image:url(../../assets/animal-screw-workshop-wood-texture.webp);background-size:cover;background-blend-mode:multiply;box-shadow:inset 0 0 0 3px #fff5bf4d,0 10px 13px #0000007a;transition:transform .36s cubic-bezier(.3,.8,.3,1),opacity .36s}.plate:after{content:"";position:absolute;inset:8px;border:2px solid rgb(255 244 195 / 22%);border-radius:inherit}.plate.shape-pill{border-radius:999px}.plate.shape-rect{border-radius:22px}.plate.shape-diamond{clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}.plate.shape-chevron{clip-path:polygon(0 0,68% 0,100% 50%,68% 100%,0 100%,28% 50%)}.plate.shape-wing{border-radius:65% 15%}.plate.shape-leaf{border-radius:75% 10%}.plate.falling{animation:plateFall .48s cubic-bezier(.55,.05,.8,.45) forwards}.board-hole,.board-screw{position:absolute;z-index:12;width:var(--wp-frame-physical-control-size, 48px);min-width:44px;height:var(--wp-frame-physical-control-size, 48px);min-height:44px;padding:0;transform:translate(-50%,-50%);border:0;border-radius:50%;background-color:transparent;background-position:center;background-size:contain;background-repeat:no-repeat;filter:drop-shadow(0 5px 4px #190d08aa);transition:filter .16s,transform .16s;touch-action:manipulation}.board-hole{background-image:url(../../assets/animal-screw-workshop-hole.webp);opacity:.9}.board-hole.valid{animation:holeGlow .8s ease-in-out infinite alternate}.board-hole.hint{animation:hintGlow .55s ease-in-out 4}.board-screw{background-image:url(../../assets/animal-screw-workshop-screw.webp)}.board-screw:hover{transform:translate(-50%,-54%) scale(1.04)}.board-screw.selected{transform:translate(-50%,-58%) scale(1.08);filter:drop-shadow(0 0 10px #fff) drop-shadow(0 0 18px #5ff4cf)}.board-screw.locked{background-image:url(../../assets/animal-screw-workshop-locked-screw.webp);filter:grayscale(.16) drop-shadow(0 4px 4px #190d08)}.board-screw.hint{animation:screwHint .55s ease-in-out 4}.board-screw img,.board-hole img{width:100%;height:100%;object-fit:contain}.battle-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:min(100%,720px);justify-self:center}.battle-actions button{display:flex;align-items:center;justify-content:center;gap:8px;min-width:0;min-height:52px;padding:6px 8px;border:2px solid var(--wp-ui-line, #527b70);border-radius:4px;background:var(--wp-ui-button-image, linear-gradient(#1b4a53, #102c37));color:var(--wp-ui-text, #f7fbf8);box-shadow:0 3px 0 var(--wp-ui-shadow, #06121a)}.battle-actions span{flex:none;color:var(--gold);font-size:21px}.battle-actions b{overflow:hidden;font-size:14px;text-overflow:ellipsis;white-space:nowrap}.battle-actions button:disabled{cursor:not-allowed;opacity:.45}.battle-actions button:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px 0 var(--wp-ui-shadow, #06121a)}.toast{position:fixed;z-index:180;left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 78px);max-width:min(88vw,520px);padding:10px 16px;transform:translate(-50%,16px);border:1px solid var(--wp-ui-line, var(--gold));border-radius:999px;background:#092332;box-shadow:0 10px 30px #000;color:#fff;font-weight:800;text-align:center;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}.toast.show{transform:translate(-50%);opacity:1}.modal-layer,.tutorial-layer{display:grid;place-items:center;padding:18px;background:#040d0ad1;backdrop-filter:blur(5px)}.modal-layer{position:absolute;z-index:150;inset:0;overflow:auto}.tutorial-layer{position:fixed;z-index:200;inset:0}.result-card,.dialog-card,.tutorial-card{position:relative;width:min(100%,460px);max-height:100%;overflow:auto;padding:24px;border:2px solid var(--wp-ui-line, #719eac);border-radius:4px;background:linear-gradient(160deg,#153e4a,#071c2b);box-shadow:0 5px 0 var(--wp-ui-shadow, #06121a);color:var(--wp-ui-text, #f7fbf8);text-align:center}.result-card>img,.tutorial-card>img{display:block;width:96px;height:96px;margin:0 auto 4px;object-fit:contain}.result-card>small{color:var(--gold);font-weight:800}.result-card h2,.dialog-card h2,.tutorial-card h2{margin:6px 0 10px}.result-card p,.dialog-card p{color:var(--muted)}.result-stars{color:var(--gold);font-size:30px;letter-spacing:4px}.best-text{color:var(--mint)!important;font-weight:800}.modal-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.dialog-card .modal-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.modal-actions button{min-width:0;min-height:48px;padding:6px;border:2px solid var(--wp-ui-line, #527b70);border-radius:4px;background:var(--wp-ui-button-image, #245c4d);color:var(--wp-ui-text, #f7fbf8);font-weight:800;overflow-wrap:anywhere}.modal-actions button:disabled{cursor:not-allowed;filter:grayscale(.7);opacity:.55}.tutorial-card{text-align:left}.tutorial-card ol{padding-left:1.35rem;line-height:1.55}.tutorial-card .primary-action{width:100%;min-height:52px}.modal-close{position:absolute;top:10px;right:10px;width:44px;height:44px;border:2px solid var(--wp-ui-line, #527b70);border-radius:4px;background:var(--wp-ui-button-image, #245c4d);color:var(--wp-ui-text, #f7fbf8);font-size:22px}@keyframes plateFall{40%{transform:rotate(calc(var(--r) + 6deg)) translateY(12px)}to{transform:rotate(calc(var(--r) + 18deg)) translateY(170px);opacity:0}}@keyframes holeGlow{to{filter:drop-shadow(0 0 12px #71ffd9) drop-shadow(0 0 18px #71ffd9);transform:translate(-50%,-50%) scale(1.06)}}@keyframes hintGlow{50%{filter:drop-shadow(0 0 16px #fff) drop-shadow(0 0 24px #ffe277)}}@keyframes screwHint{50%{transform:translate(-50%,-60%) scale(1.08);filter:drop-shadow(0 0 16px #fff)}}@media(max-width:600px){.battle-workspace{gap:6px;padding:6px}.puzzle-board{border-width:6px}.result-card,.dialog-card,.tutorial-card{padding:18px}.result-card>img,.tutorial-card>img{width:78px;height:78px}.dialog-card .modal-actions{grid-template-columns:1fr}}@media(max-height:560px)and (orientation:landscape){.battle-workspace{gap:5px;padding:4px 8px}.battle-actions{gap:6px}.battle-actions button{min-height:48px}.modal-layer,.tutorial-layer{padding:6px}.modal-layer{place-items:start center}.result-card,.dialog-card,.tutorial-card{padding:8px 14px}.result-card>img{display:none}.tutorial-card>img{width:54px;height:54px;margin:0 auto}.result-card h2,.dialog-card h2,.tutorial-card h2{margin:2px 0 4px;font-size:18px}.result-card p,.dialog-card p{margin:2px 0}.result-card .result-stars{margin:0;font-size:22px;line-height:1;letter-spacing:2px}.modal-actions button{min-height:44px}}@media(prefers-reduced-motion:reduce){.plate,.board-hole,.board-screw,.battle-actions button,.toast{transition-duration:.01ms!important}.plate.falling{animation:none!important;opacity:0}.board-hole.valid,.board-hole.hint,.board-screw.hint{animation:none!important;outline:3px solid #9cfaff;outline-offset:2px}.toast,.toast.show{transform:translate(-50%)}}