:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#263e35;background:#eef2df;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 20% 20%,#f6f6e9,transparent 60%),#e9eee0;min-height:100svh}button{font:inherit;font-size:14px;font-weight:800;letter-spacing:.04em;min-height:48px;border:1px solid #ccd5c4;border-radius:15px;background:#f9faef;color:#334b3e;cursor:pointer;padding:12px 18px;box-shadow:0 3px 0 #d3dccb;touch-action:manipulation}button:hover{filter:brightness(.97);transform:translateY(-1px)}button:active{transform:translateY(2px);box-shadow:none}button:focus-visible,.screw:focus-visible{outline:3px solid #d78f3a;outline-offset:4px}button:disabled{opacity:.38;cursor:default}.primary{background:#365c45;color:#fff;border-color:#365c45;box-shadow:0 5px 0 #254332}.quiet{border:none;background:transparent;box-shadow:none}.icon{font-size:24px;width:48px;padding:5px}#app{max-width:480px;margin:auto;min-height:100svh;position:relative}.home,.game{padding:24px 24px max(20px,env(safe-area-inset-bottom));min-height:100svh}header{display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{font-size:10px;font-weight:800;letter-spacing:2px}.coins{white-space:nowrap;background:#fff9df;border:1px solid #e8ddb6;padding:9px 14px;border-radius:30px;font-weight:800;font-size:14px}.coins>span{color:#be902d;font-size:20px}.hero{text-align:center;padding-top:50px}.eyebrow{font-size:10px;letter-spacing:2.2px;font-weight:800;color:#7c8b73}h1{font-size:clamp(52px,14vw,72px);line-height:.94;letter-spacing:-4px;margin:20px 0;position:relative}h1 em{font-style:normal;color:#ce7a46}.title-dot{position:absolute;font-size:28px;color:#cead51;top:0;right:12px}.hero p{font-size:15px;color:#7b8774}.hero-art{height:225px;position:relative;max-width:300px;margin:20px auto}.art-board{position:absolute;width:260px;height:68px;background:linear-gradient(#debb91,#be8b5e);border:2px solid #b57d4e;border-radius:16px;box-shadow:0 10px 12px #43563925;display:flex;justify-content:space-between;align-items:center;padding:14px 20px;top:65px;left:20px;transform:rotate(-25deg)}.art-board.two{transform:rotate(26deg);background:linear-gradient(#bdcfca,#8ea9a2);border-color:#78968d}.art-board i{font-style:normal;width:40px;height:40px;border:4px solid #f6e9d3;border-radius:50%;background:#d77a49;color:white;font-size:24px;font-weight:800;box-shadow:0 3px 0 #536357}.two i{background:#579d9c}.spark{position:absolute;right:0;bottom:12px;font-size:48px;color:#c2a552}.home-actions{display:grid;gap:12px}.home-actions .primary{font-size:20px;min-height:60px}.home-actions p{text-align:center;font-size:12px;color:#7c8975;margin:6px}.home footer{text-align:center;color:#87927e;font-size:10px;margin:25px 0 0}.level-title{flex:1}.level-title>span{font-weight:900;font-size:16px}.level-title small{color:#92a08d;font-size:12px}.level-title p{margin:3px 0;font-size:12px;color:#7c8975}.progress{height:5px;background:#dce3d2;margin-top:24px;border-radius:4px;overflow:hidden}.progress i{display:block;height:100%;background:#c18e49;transition:width .3s}.objective{text-align:center;letter-spacing:2px;font-size:10px;font-weight:800;margin:20px 0 14px}.workbench{border:1px solid #cbd5be;border-radius:24px;background:radial-gradient(#eff1df 1px,transparent 1px),#e1e7d4;background-size:14px 14px;position:relative;box-shadow:inset 0 3px 10px #4a62380c;overflow:hidden}.puzzle{display:block;width:100%;max-height:43svh;min-height:265px;touch-action:none}.bench-label{display:block;text-align:center;font-size:8px;letter-spacing:2px;color:#8b9a7d;padding-bottom:14px}.board{transition:opacity .4s}.board.released{opacity:0;pointer-events:none}.screw{cursor:pointer}.screw.locked{opacity:.75}.screw .halo{stroke:transparent;stroke-width:3}.screw.hinted .halo{stroke:#365c45;stroke-dasharray:4 3;animation:pulse 1s infinite}.tray-label{display:flex;justify-content:space-between;margin:22px 0 10px;font-size:9px;letter-spacing:1.5px;font-weight:800;color:#7e8d73}.tray{display:flex;justify-content:center;gap:15px;background:#d6dfc8;border:1px solid #bdcbb0;border-radius:18px;padding:12px}.slot{width:48px;height:48px;border-radius:50%;background:#bfcdb2;box-shadow:inset 0 3px 4px #33492e20;display:grid;place-items:center}.slot b{color:#8da27d}.slot span{display:grid;place-items:center;width:39px;height:39px;border:3px solid #fff1dc;border-radius:50%;font-weight:900;color:#fff;font-size:21px;animation:pop .2s}.tip{font-size:12px;line-height:1.5;text-align:center;color:#78866e;min-height:36px;margin:14px 0}nav{display:flex;gap:8px}nav button{flex:1;padding:12px 6px;font-size:11px}.hint-button{background:#ebbd68;border-color:#d5a750;box-shadow:0 3px 0 #cda052}.bottom{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#87947a;margin-top:12px}.bottom button{font-size:10px;padding-left:0}.overlay{position:fixed;inset:0;background:#243b32a6;backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;padding:20px;z-index:10}.modal{width:100%;max-width:380px;max-height:90svh;overflow:auto;background:#f5f5e7;border-radius:26px;padding:30px;display:flex;flex-direction:column;gap:12px;text-align:center;box-shadow:0 20px 60px #10261e44;animation:pop .22s}.modal h2{font-size:27px;letter-spacing:-1px;margin:8px 0}.modal p{font-size:13px;line-height:1.5;color:#78866e;margin:4px 0}.modal .fine{font-size:10px}.modal .status{color:#a96434;min-height:0}.result-icon{font-size:58px;color:#c79741}.modal .reward{color:#365c45;font-size:38px;font-weight:900}.reward span{font-size:15px}.level-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.level-grid button{padding:9px;position:relative}.level-grid small{position:absolute;right:5px;top:4px;color:#9c7536}.celebration{animation:pulse 1s infinite}@keyframes pop{from{opacity:0;scale:.9}to{opacity:1;scale:1}}@keyframes pulse{50%{opacity:.5}}@media(min-width:700px){#app{margin:28px auto;min-height:800px;background:#f1f3e3;border:1px solid #d8dfcd;border-radius:30px;box-shadow:0 20px 80px #35472f18;overflow:hidden}.home,.game{min-height:800px}.puzzle{max-height:390px}.home{padding-top:28px}}@media(max-height:740px) and (max-width:699px){.home,.game{padding-top:14px}.hero{padding-top:22px}.hero-art{height:180px}.puzzle{min-height:210px;max-height:39svh}.tray-label{margin-top:14px}.objective{margin:12px 0}.tip{margin:8px 0}.progress{margin-top:14px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

.board.released{animation:board-fall .55s ease-in forwards}@keyframes board-fall{to{translate:0 140px;rotate:18deg;opacity:0}}
.screw.hinted text{font-weight:900}.game:has(+ .overlay),.home:has(+ .overlay){pointer-events:none}
/* Version 2: one-shot effects, portrait-safe geometry, and workshop polish. */
html{overflow-x:hidden}body{overscroll-behavior-y:contain}.game,.home{padding-top:max(20px,env(safe-area-inset-top))}.level-title{min-width:0}.level-title p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.home .art-board{width:min(260px,calc(100% - 40px))}.workbench{box-shadow:inset 0 2px 8px #40573310,0 6px 16px #4057330a}.workbench::before,.workbench::after{content:'';position:absolute;width:6px;height:6px;border-radius:50%;background:#a9b99a;top:12px;pointer-events:none}.workbench::before{left:12px}.workbench::after{right:12px}.puzzle{height:auto;max-height:none;min-height:0;aspect-ratio:360/430;touch-action:none;user-select:none;-webkit-user-select:none}.board-number{fill:#354b3d;font-size:13px;font-weight:900;pointer-events:none}.dependency-rail{fill:none;stroke:#839376;stroke-width:1.5;stroke-dasharray:3 5;opacity:.45;pointer-events:none}.lock-tag{pointer-events:none}.lock-tag rect{fill:#f4edd6;stroke:#ae9265;stroke-width:1}.lock-tag text{fill:#695a3f;font-size:11px;font-weight:850}.screw{touch-action:manipulation;-webkit-tap-highlight-color:transparent}.screw.locked{opacity:1}.screw.locked>circle:not(.hit):not(.halo){filter:saturate(.7)}.board.releasing{pointer-events:none;animation:release-board 620ms cubic-bezier(.32,.05,.73,.4) forwards;transform-box:view-box;transform-origin:0 0}.board-body.swinging{animation:board-swing 420ms cubic-bezier(.3,1.5,.55,1) both;transform-box:view-box;transform-origin:var(--pivot) 0}.screw-out{pointer-events:none;transform-box:view-box;transform-origin:0 0;animation:unscrew 440ms cubic-bezier(.2,.8,.3,1) forwards}.screw-ripple{pointer-events:none;transform-box:view-box;transform-origin:0 0;animation:ripple-out 380ms ease-out forwards}.difficulty{display:inline-block;font-size:8px;letter-spacing:1px;color:#738567;margin-left:8px;padding:5px 7px;background:#dfe6d1;border-radius:6px}.objective{display:flex;align-items:center;justify-content:center;margin:14px 0}.progress i{transition:width 350ms ease-out}.tray{box-shadow:inset 0 1px 0 #f2f5e6,0 3px 8px #3c56350b}.slot span{animation:tray-land 240ms cubic-bezier(.2,1.4,.4,1)}.modal{position:relative;z-index:1;animation:modal-enter 250ms cubic-bezier(.2,.8,.3,1) both}.win-overlay{animation:completion-reveal 550ms ease-out both}.win-overlay .modal{animation:completion-card 600ms cubic-bezier(.2,.8,.3,1) both}.win-overlay .celebration{animation:star-bloom 800ms cubic-bezier(.2,.8,.3,1) both}.win-overlay .reward{animation:reward-rise 750ms ease-out both}.confetti{position:absolute;inset:0;overflow:hidden;pointer-events:none}.confetti i{position:absolute;left:var(--x);top:-20px;width:8px;height:13px;border-radius:2px;animation:confetti-fall 1800ms var(--delay) cubic-bezier(.1,.3,.6,1) forwards}.tip{font-size:13px;min-height:38px}.tray-label{font-size:10px}nav button{font-size:12px}.bottom button{font-size:11px}.bench-label{font-size:9px}.modal .fine{font-size:11px}.overlay{padding:16px;padding-top:max(16px,env(safe-area-inset-top));padding-bottom:max(16px,env(safe-area-inset-bottom))}.modal{max-height:calc(100svh - 48px);overscroll-behavior:contain}.level-grid button{min-height:52px}.modal .status:empty{display:none}
@keyframes unscrew{0%{opacity:1;transform:rotate(0) scale(1)}45%{opacity:1;transform:translateY(-10px) rotate(160deg) scale(1.12)}100%{opacity:0;transform:translateY(-36px) rotate(280deg) scale(.45)}}
@keyframes ripple-out{0%{opacity:.8;transform:scale(.8)}100%{opacity:0;transform:scale(1.7)}}
@keyframes board-swing{from{transform:rotate(0)}to{transform:rotate(var(--swing))}}
@keyframes release-board{0%{opacity:1;transform:translateY(0) rotate(0)}25%{opacity:1;transform:translateY(5px) rotate(3deg)}100%{opacity:0;transform:translateY(170px) rotate(24deg)}}
@keyframes tray-land{from{opacity:0;transform:translateY(-8px) scale(.8)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes modal-enter{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes completion-reveal{0%,35%{opacity:0}100%{opacity:1}}
@keyframes completion-card{0%,30%{opacity:0;transform:translateY(25px) scale(.92)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes star-bloom{0%,30%{opacity:0;transform:rotate(-30deg) scale(.3)}75%{opacity:1;transform:rotate(8deg) scale(1.12)}100%{transform:rotate(0) scale(1)}}
@keyframes reward-rise{0%,45%{opacity:0;transform:translateY(10px)}100%{opacity:1;transform:translateY(0)}}
@keyframes confetti-fall{0%{opacity:0;transform:translate(0,0) rotate(0)}15%{opacity:.9}85%{opacity:.85}100%{opacity:0;transform:translate(var(--drift),105svh) rotate(var(--spin))}}
@media(max-width:360px){.home,.game{padding-left:16px;padding-right:16px}.brand{letter-spacing:1px}.coins{padding:8px 10px;font-size:12px}.modal{padding:22px}.tray{gap:12px}.level-title>span{font-size:14px}}
@media(max-height:760px) and (max-width:699px){.game{padding-top:max(12px,env(safe-area-inset-top));padding-bottom:12px}.game .progress{margin-top:12px}.game .objective{margin:10px 0}.game .tray-label{margin-top:12px}.game .tip{margin:8px 0;min-height:32px}.game .bottom{margin-top:4px}.game .bench-label{padding-bottom:8px}.hero{padding-top:20px}.hero-art{height:165px}.home footer{margin-top:16px}}
@media(hover:none){button:hover{filter:none;transform:none}}
@media(prefers-reduced-motion:reduce){.board.releasing,.screw-out,.screw-ripple,.confetti{display:none}.win-overlay,.win-overlay .modal,.win-overlay .reward,.win-overlay .celebration{opacity:1;transform:none}}