@import "https://fonts.googleapis.com/css2?family=Baloo+2:wght@600;700;800&family=Nunito:wght@700;800;900&display=swap";:root{color:#17335f;font-synthesis:none;text-rendering:optimizelegibility;--navy:#17335f;--blue:#0877c9;--cream:#fffaf1;--tile-size:clamp(78px, 11.2vmin, 124px);--shape-size:clamp(52px, 8vmin, 84px);--drag-scale:1.3;background:#fffaf1;font-family:Nunito,system-ui,sans-serif}*{box-sizing:border-box}html,body{width:100%;min-height:100%;margin:0}html{overscroll-behavior:none}body{background:radial-gradient(circle at 12% 8%, #ffd21f21, transparent 24%), radial-gradient(circle at 88% 86%, #0877c917, transparent 28%), var(--cream);flex-direction:column;min-width:320px;height:100dvh;display:flex;overflow:hidden}#root{flex:1;width:100%;min-height:0}button{font:inherit}.app-shell{width:100%;height:100%;padding:max(10px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));grid-template-rows:auto auto minmax(0,1fr) auto;display:grid;overflow:hidden}.game-header{z-index:20;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:14px;width:min(1440px,100%);min-height:68px;margin:0 auto;display:grid;position:relative}.brand-block{align-items:center;gap:11px;min-width:0;display:flex}.logo-bubble{color:#fff;background:#0877c9;border-radius:15px;flex:none;place-items:center;width:48px;height:48px;display:grid;transform:rotate(-4deg);box-shadow:0 5px #045b9c,0 10px 18px #084d8229}.logo-bubble svg{stroke-width:3px;width:27px}.game-name{text-transform:uppercase;letter-spacing:.1em;color:#e34b46;margin:0 0 -3px;font-size:11px;font-weight:900}.game-header h1{text-transform:uppercase;color:var(--navy);white-space:nowrap;margin:0;font-family:"Baloo 2",sans-serif;font-size:clamp(21px,2.5vw,32px);line-height:1}.progress{background:#fff;border-radius:20px;flex-direction:column;align-items:center;min-width:112px;padding:7px 19px 5px;line-height:1;display:flex;box-shadow:0 4px #e9ddca,0 8px 22px #3d321f14}.progress span{font-family:"Baloo 2",sans-serif;font-size:26px;font-weight:800}.progress small{letter-spacing:.16em;color:#7685a1;font-size:8px;font-weight:900}.header-actions{justify-self:end;gap:9px;display:flex}.round-button{color:#fff;cursor:pointer;background:#0877c9;border:0;border-radius:50%;place-items:center;width:45px;height:45px;transition:transform .16s,box-shadow .16s;display:grid;box-shadow:0 4px #05588f,0 7px 12px #17335f24}.round-button.sound{background:#61b947;box-shadow:0 4px #3d9130,0 7px 12px #2d682524}.round-button svg{stroke-width:3px;width:22px}.round-button:hover{transform:translateY(-2px)}.round-button:active{transform:translateY(3px);box-shadow:0 1px #05588f}.mode-switcher{z-index:19;grid-template-columns:repeat(4,1fr);gap:7px;width:min(680px,100% - 12px);margin:3px auto 8px;display:grid;position:relative}.mode-switcher.match-spacer{height:2px;min-height:2px;margin-block:0 3px}.mode-switcher button{color:#60708a;cursor:pointer;background:#ffffffeb;border:2px solid #dce4ef;border-radius:14px;justify-content:center;align-items:center;gap:7px;min-height:45px;font-size:12px;font-weight:900;display:flex;box-shadow:0 3px #e5ded2}.mode-switcher button.selected{color:#fff;background:#0877c9;border-color:#0877c9;box-shadow:0 4px #055a96}.activity-switcher{z-index:19;grid-template-columns:repeat(4,1fr);gap:8px;width:min(760px,100% - 12px);margin:4px auto 9px;display:grid;position:relative}.activity-switcher button{color:#60708a;cursor:pointer;background:#fffffff0;border:2px solid #dce4ef;border-radius:15px;justify-content:center;align-items:center;gap:8px;min-height:48px;padding:7px 12px;font-size:12px;font-weight:900;transition:transform .16s,background .16s,color .16s;display:flex;box-shadow:0 3px #e5ded2}.activity-switcher button:hover{transform:translateY(-2px)}.activity-switcher button.selected{color:#fff;background:#0877c9;border-color:#0877c9;box-shadow:0 4px #055a96}.activity-switcher svg{stroke-width:3px;flex:none;width:22px;height:22px}.play-canvas{isolation:isolate;touch-action:none;-webkit-user-select:none;user-select:none;background-color:#fff9;background-image:linear-gradient(90deg,#17335f06 1px,#0000 1px),linear-gradient(#17335f06 1px,#0000 1px),none;background-position:0 0,0 0,0 0;background-repeat:repeat,repeat,repeat;background-size:34px 34px;background-attachment:scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box;border:2px solid #17335f14;border-radius:28px;width:min(1440px,100%);height:100%;min-height:0;margin:0 auto;position:relative;overflow:hidden;box-shadow:inset 0 0 60px #fffc,0 10px 36px #2c364812}.play-canvas:after{content:"";pointer-events:none;border-radius:inherit;z-index:18;position:absolute;inset:0;box-shadow:inset 0 0 0 7px #ffffff73}.play-canvas.pair{--tile-size:clamp(148px, 25vmin, 226px);--shape-size:clamp(104px, 17.5vmin, 158px);background:radial-gradient(circle at 30% 51%,#f5822017,#0000 18%),radial-gradient(circle at 70% 51%,#0877c917,#0000 18%),linear-gradient(90deg,#17335f06 1px,#0000 1px) 0 0/34px 34px,linear-gradient(#17335f06 1px,#0000 1px) 0 0/34px 34px,#ffffffad}.play-canvas.pair:before{content:"";pointer-events:none;border-top:4px dashed #0877c933;position:absolute;top:51%;left:39%;right:39%}.foam-object{z-index:5;width:var(--tile-size);height:var(--tile-size);transform-style:preserve-3d;transform:translate(-50%, -50%) perspective(650px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) rotateZ(var(--rotate,0deg));filter:drop-shadow(0 7px 5px #34291d30);cursor:grab;touch-action:none;-webkit-tap-highlight-color:transparent;background:0 0;border:0;padding:0;transition:filter .14s,transform .16s cubic-bezier(.2,.8,.2,1);position:absolute}.foam-object svg{pointer-events:none;width:100%;height:100%;overflow:visible}.foam-object.active{z-index:14;cursor:grabbing;filter:drop-shadow(0 17px 9px #34291d3d);transform:translate(-50%, -62%) perspective(650px) rotateX(0deg) rotateY(0deg) rotateZ(var(--rotate,0deg)) scale(var(--drag-scale));transition:filter .12s,transform .12s}.shape-object{width:var(--shape-size);height:var(--shape-size);z-index:7}.completed-object:not(.draggable){cursor:default;animation:.5s cubic-bezier(.2,1.5,.4,1) settle}.completed-object.draggable{z-index:9}.foam-face{stroke:#2b27232e;stroke-width:.65px;stroke-linejoin:round}.foam-side{stroke:#2b272333;stroke-width:.75px;stroke-linejoin:round}.foam-texture{pointer-events:none;opacity:.96;stroke:none}.foam-edge-highlight,.shape-edge-highlight{fill:none;stroke:#ffffff57;stroke-width:1.1px;stroke-linejoin:round;pointer-events:none;transform:translateY(-.35px)}.shape-edge-highlight{stroke-width:1.35px}.hole-depth{fill:none;stroke:#22191257;stroke-width:4.8px;stroke-linejoin:round;filter:drop-shadow(0 1px 1px #0000002e)}.hole-highlight{fill:none;stroke:#ffffff73;stroke-width:1.6px;stroke-linejoin:round}.insert-bed{stroke:#1f19133d;stroke-width:2.2px;stroke-linejoin:round}.insert{stroke-width:.7px}.insert-texture{opacity:.68}.insert-seam{fill:none;stroke:#251d1657;stroke-width:1.35px;stroke-linejoin:round;filter:drop-shadow(0 -.55px .25px #ffffff61)}.build-guide{z-index:1;pointer-events:none;position:absolute;inset:0}.target-slot{width:var(--tile-size);height:var(--tile-size);opacity:.54;filter:drop-shadow(0 0 5px #0877c940);transform:translate(-50%, -50%) rotate(var(--target-rotate,0deg));transform-origin:50%;animation:1.8s ease-in-out infinite guidePulse;position:absolute}.target-slot svg{width:100%;height:100%;overflow:visible}.target-slot path{fill:#0877c90e;stroke:#68a9dd;stroke-width:2.2px;stroke-dasharray:5 4}.target-slot.filled{opacity:0;animation:none}.play-hint{color:#6d7890;text-align:center;letter-spacing:.035em;min-height:18px;margin:6px auto 0;font-size:12px;font-weight:900}.next-button{z-index:20;color:#fff;cursor:pointer;background:#61b947;border:0;border-radius:18px;padding:13px 28px;font-family:"Baloo 2",sans-serif;font-size:20px;font-weight:800;position:absolute;bottom:22px;left:50%;transform:translate(-50%);box-shadow:0 6px #398c2d,0 12px 24px #398c2d33}.overlay{z-index:30;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#12284861;place-items:center;padding:18px;display:grid;position:absolute;inset:0}.chooser-card{text-align:center;background:#fffaf1;border:5px solid #fff;border-radius:34px;width:min(620px,94%);padding:clamp(22px,4vw,38px);animation:.48s cubic-bezier(.18,1.45,.42,1) cardIn;box-shadow:0 16px #10335a2e,0 28px 70px #1127484d}.chooser-stars{color:#ffd21f;letter-spacing:.15em;filter:drop-shadow(0 2px #e9a821);font-size:29px}.chooser-stars span{color:#f05252;font-size:39px}.chooser-card h2{color:#e8464f;margin:6px 0 0;font-family:"Baloo 2",sans-serif;font-size:clamp(30px,6vw,47px);line-height:1}.chooser-card p{color:#5f6d85;margin:7px 0 21px;font-size:15px;font-weight:900}.build-options{grid-template-columns:repeat(4,1fr);gap:10px;display:grid}.build-options button{min-height:118px;color:var(--navy);cursor:pointer;background:#fff;border:3px solid #e2e9f1;border-radius:20px;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:10px 6px;font-size:13px;font-weight:900;transition:transform .18s,border-color .18s;display:flex;box-shadow:0 5px #dbe1e8}.build-options button:hover{border-color:#6fb3e2;transform:translateY(-5px)}.make-options{grid-template-columns:repeat(3,1fr)}.chooser-close{color:#6d7890;cursor:pointer;background:0 0;border:0;margin-top:17px;padding:8px 18px;font-size:12px;font-weight:900}.mode-glyph{width:52px;height:46px;display:block;position:relative}.mode-switcher .mode-glyph{flex:none;width:28px;height:25px;transform:scale(.72)}.mode-glyph i{display:block;position:absolute}.mat-glyph{grid-template-rows:1fr 1fr;grid-template-columns:1fr 1fr;gap:2px;display:grid;transform:rotate(-3deg)}.mat-glyph i{background:#f58220;border-radius:3px;position:static}.mat-glyph i:nth-child(2){background:#ffd21f}.mat-glyph i:nth-child(3){background:#63bd49}.mat-glyph i:nth-child(4){background:#0879b8}.house-glyph:before{content:"";background:#63bd49;border-radius:3px;height:27px;position:absolute;bottom:2px;left:8px;right:8px}.house-glyph:after{content:"";clip-path:polygon(50% 0,100% 100%,0 100%);background:#f05252;width:43px;height:28px;position:absolute;top:0;left:4px}.house-glyph i{z-index:2;background:#0879b8;width:10px;height:18px;bottom:2px;left:23px}.castle-glyph i{background:#6e3a92;width:18px;height:32px;bottom:2px}.castle-glyph i:first-child{left:0}.castle-glyph i:nth-child(2){background:#f58220;height:40px;left:17px}.castle-glyph i:nth-child(3){right:0}.castle-glyph:after{content:"";background:#0879b8;height:8px;position:absolute;bottom:0;left:0;right:0}.bridge-glyph:before{content:"";border:9px solid #f58220;border-bottom:0;border-radius:50% 50% 0 0;position:absolute;inset:7px 0 5px}.bridge-glyph i{background:#0879b8;width:8px;height:25px;bottom:1px}.bridge-glyph i:first-child{left:5px}.bridge-glyph i:last-child{right:5px}.completion-card{width:min(480px,94%)}.trophy{color:#fff;background:#ffd21f;border-radius:50%;place-items:center;width:80px;height:80px;margin:-8px auto 10px;font-size:50px;line-height:1;animation:.8s ease-in-out infinite alternate trophyBounce;display:grid;box-shadow:0 7px #e5a91a}.completion-actions{gap:10px;display:grid}.completion-actions button{color:#40516e;cursor:pointer;background:#fff;border:2px solid #d7e1ec;border-radius:16px;padding:12px 18px;font-weight:900}.completion-actions button.primary{color:#fff;background:#61b947;border-color:#61b947;box-shadow:0 5px #3c8f30}.celebration{z-index:26;pointer-events:none;width:1px;height:1px;position:absolute}.celebration i{--angle:calc((360deg / var(--count)) * var(--i));border-radius:calc((var(--i) % 2) * 50%);background:hsl(calc(var(--i) * 47) 85% 55%);width:10px;height:10px;transform:rotate(var(--angle)) translateY(-10px);animation:1s ease-out forwards confetti;position:absolute;top:-5px;left:-5px}.celebration.big i{width:13px;height:13px;animation-duration:1.65s}.celebration strong{color:#e6414e;text-shadow:0 2px #fff,2px 0 #fff,0 -2px #fff,-2px 0 #fff,0 5px 8px #00000026;font-family:"Baloo 2",sans-serif;font-size:24px;animation:1s ease-out forwards cheer;position:absolute;top:0;left:0;transform:translate(-50%,-50%)}.celebration.big strong{font-size:38px;animation-duration:1.6s}@keyframes confetti{0%{opacity:1;transform:rotate(var(--angle)) translateY(-8px) scale(.5)}to{opacity:0;transform:rotate(var(--angle)) translateY(-100px) rotate(240deg) scale(1.15)}}@keyframes cheer{0%{opacity:0;transform:translate(-50%,-30%)scale(.2)}22%{opacity:1;transform:translate(-50%,-70%)scale(1.18)}to{opacity:0;transform:translate(-50%,-170%)scale(.9)}}@keyframes settle{0%{transform:translate(-50%,-58%)scale(1.2)rotate(4deg)}to{transform:translate(-50%, -50%) perspective(650px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) rotateZ(var(--rotate))}}@keyframes cardIn{0%{opacity:0;transform:scale(.65)translateY(30px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes guidePulse{0%,to{opacity:.36;transform:translate(-50%, -50%) rotate(var(--target-rotate,0deg)) scale(.96)}50%{opacity:.7;transform:translate(-50%, -50%) rotate(var(--target-rotate,0deg)) scale(1.03)}}@keyframes trophyBounce{to{transform:translateY(-6px)rotate(4deg)}}@media (width<=720px){:root{--tile-size:clamp(52px, 14.5vw, 72px);--shape-size:clamp(35px, 10vw, 50px);--drag-scale:1.42}.app-shell{padding-inline:7px}.game-header{grid-template-columns:1fr auto;gap:6px;min-height:62px}.logo-bubble{border-radius:12px;width:39px;height:39px}.logo-bubble svg{width:22px}.game-name{display:none}.game-header h1{font-size:clamp(17px,5vw,23px)}.progress{min-width:78px;padding:5px 11px 4px;position:absolute;left:50%;transform:translate(-50%)}.progress span{font-size:20px}.progress small{font-size:7px}.header-actions{gap:5px}.round-button{width:38px;height:38px}.round-button svg{width:19px}.fullscreen{display:none}.play-canvas{border-radius:20px}.play-hint{font-size:10px}.mode-switcher{gap:4px;margin-bottom:5px}.mode-switcher button{border-radius:11px;min-height:40px;padding:4px;font-size:0}.mode-switcher .mode-glyph{transform:scale(.78)}.activity-switcher{gap:4px;margin:3px auto 6px}.activity-switcher button{border-radius:11px;gap:3px;min-height:43px;padding:4px 3px;font-size:9px;line-height:1}.activity-switcher svg{width:18px;height:18px}.play-canvas.pair{--tile-size:clamp(118px, 30vw, 150px);--shape-size:clamp(82px, 21vw, 105px)}.build-options{grid-template-columns:repeat(2,1fr)}.make-options{grid-template-columns:repeat(3,1fr)}.build-options button{min-height:92px}.chooser-card{border-radius:26px;padding:20px}}@media (width<=430px) and (orientation:portrait){:root{--tile-size:clamp(49px, 14.5vw, 64px);--shape-size:clamp(33px, 9.5vw, 44px)}.brand-block{gap:6px}.logo-bubble{width:34px;height:34px}.game-header h1{white-space:normal;max-width:108px;line-height:.86}.celebration strong{font-size:19px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media (prefers-contrast:more){.play-canvas{border-color:var(--navy)}.hole-rim{stroke:#111}.target-slot path{stroke-width:4px;stroke:#005da6}}