.completion-top-actions{z-index:1001;top:max(1rem,env(safe-area-inset-top));right:max(1rem,env(safe-area-inset-right));align-items:center;gap:.6rem;display:flex;position:fixed}.completion-home-link{border:2px solid var(--ink);background:var(--white);min-height:2.5rem;box-shadow:2px 2px 0 var(--ink);color:var(--blue);align-items:center;gap:.4rem;padding:0 .7rem;font-size:.8rem;font-weight:800;text-decoration:none;transition:transform .15s,box-shadow .15s,color .15s;display:inline-flex}.completion-home-link:hover{color:var(--coral);transform:translateY(-1px)}.completion-home-link:active{box-shadow:1px 1px 0 var(--ink);transform:translate(1px,1px)}.completion-home-link:focus-visible{outline:3px solid var(--coral);outline-offset:3px}.completion-home-link svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px;flex:none;width:1rem;height:1rem}.completion-sound-toggle{width:2.5rem;height:2.5rem;box-shadow:2px 2px 0 var(--ink);position:static}.reference-panel{border:2px solid var(--ink);background:var(--yellow);box-shadow:var(--shadow);gap:.7rem;padding:.8rem;display:grid}.reference-label{color:var(--yellow-foreground);font-size:.75rem;font-weight:800}.reference-panel img{-o-object-fit:cover;object-fit:cover;background:var(--white);display:block}.board-loading,.reference-panel img{aspect-ratio:1;border:2px solid var(--ink);width:100%}.board-loading{background:var(--yellow);max-width:590px;color:var(--yellow-foreground);place-items:center;margin-inline:auto;font-size:.88rem;font-weight:700;display:grid}@media (width<=760px){.reference-panel{grid-template-columns:1fr 96px;align-items:center}.reference-label,.reference-panel p{grid-column:1}.reference-panel img{grid-area:1/2/span 2;width:96px;height:96px}}.puzzle-board{grid-template-columns:repeat(var(--grid-columns),minmax(0,1fr));grid-template-rows:repeat(var(--grid-rows),minmax(0,1fr));width:min(100%,var(--board-max-width,590px));aspect-ratio:var(--image-ratio,1);border:2px solid var(--ink);background:var(--ink);touch-action:none;gap:3px;margin-inline:auto;display:grid}.puzzle-board .piece-move{transition:transform .34s cubic-bezier(.2,.8,.2,1)}.completion-screen{z-index:1000;background:var(--paper);place-items:safe center;padding:1.25rem;display:grid;position:fixed;inset:0;overflow:auto}.completion-content{justify-items:center;gap:calc(clamp(.75rem,2.8vh,1.25rem));width:100%;display:grid}.completion-board{grid-template-columns:repeat(var(--grid-columns),minmax(0,1fr));grid-template-rows:repeat(var(--grid-rows),minmax(0,1fr));width:calc(min(88vw,48svh,640px));aspect-ratio:var(--image-ratio,1);border:2px solid var(--ink);background:var(--ink);box-shadow:7px 7px 0 var(--yellow);transform-origin:50%;gap:3px;display:grid}.completion-piece{background-color:var(--line);background-image:var(--image-url);background-size:calc(var(--grid-columns) * 100%) calc(var(--grid-rows) * 100%);min-width:0;min-height:0}.completion-title{color:var(--blue);text-align:center;font-size:calc(clamp(2rem,5vw,3rem));font-weight:850;line-height:1}.completion-result{justify-items:center;gap:.4rem;display:grid}.completion-copy{color:var(--muted);text-align:center;margin:0;font-size:.9rem;font-weight:650}.completion-art-description{max-width:calc(min(62ch,88vw));color:var(--muted);text-align:center;gap:.25rem;margin:.2rem 0 0;font-size:.88rem;line-height:1.65;display:grid}.completion-art-description strong{color:var(--ink);font-size:.75rem}.completion-art-description p{margin:0}.completion-actions{flex-wrap:wrap;justify-content:center;align-items:center;gap:.8rem;max-width:100%;display:flex}.completion-action-icon{border:2px solid var(--ink);background:var(--white);width:2.8rem;height:2.8rem;box-shadow:3px 3px 0 var(--ink);color:var(--blue);cursor:pointer;place-items:center;transition:transform .15s,box-shadow .15s,color .15s;display:grid}.completion-action-icon:hover{color:var(--coral);transform:translateY(-2px)}.completion-action-icon:active{box-shadow:1px 1px 0 var(--ink);transform:translate(2px,2px)}.completion-action-icon:focus-visible{outline:3px solid var(--coral);outline-offset:3px}.completion-action-icon svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px;width:1.25rem;height:1.25rem}.completion-action-tooltip{border:1px solid var(--ink);box-shadow:2px 2px 0 var(--yellow);padding:.35rem .55rem;font-size:.75rem;font-weight:700;z-index:1100!important;background:var(--ink)!important;color:var(--paper)!important}.completion-share-feedback{margin:-.35rem 0 0;font-size:.78rem}.completion-account-note,.completion-share-feedback{color:var(--success-foreground);text-align:center;font-weight:700}.completion-account-note{max-width:34ch;margin:-.2rem 0 0;font-size:.84rem;line-height:1.5}.completion-account-actions{color:var(--muted);gap:.3rem .55rem;font-size:.78rem}.completion-account-actions,.completion-navigation-actions{flex-wrap:wrap;justify-content:center;align-items:center;max-width:100%;display:flex}.completion-navigation-actions{gap:.7rem}.completion-archive-link{min-height:2.7rem;margin:0}.completion-leaderboard-link{color:var(--blue);text-underline-offset:.2rem;align-items:center;gap:.35rem;font-size:.8rem;font-weight:750;text-decoration-thickness:1px;display:inline-flex}.completion-leaderboard-link svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px;flex:none;width:1rem;height:1rem}.completion-leaderboard-link:focus-visible{outline:3px solid var(--coral);outline-offset:3px}.completion-save-status{color:var(--muted);font-size:.78rem;font-weight:700}.completion-account-link,.completion-login-link{color:var(--blue);text-underline-offset:.2rem;font-size:.8rem;font-weight:750;text-decoration-thickness:1px}.completion-account-link:focus-visible,.completion-login-link:focus-visible{outline:3px solid var(--coral);outline-offset:3px}.completion-restart{border:2px solid var(--ink);width:2.7rem;height:2.7rem;box-shadow:3px 3px 0 var(--ink);border-radius:0;flex:none}.completion-enter-active{transition:opacity .25s}.completion-leave-active{transition:opacity .16s ease-in}.completion-enter-active .completion-board{transition:transform .48s cubic-bezier(.16,1,.3,1)}.completion-leave-active .completion-board{transition:transform .16s ease-in}.completion-enter-from .completion-board{transform:translate(var(--origin-x),var(--origin-y)) scale(var(--origin-scale))}.completion-leave-to .completion-board{transform:scale(.96)}.completion-enter-active .completion-account-actions,.completion-enter-active .completion-actions,.completion-enter-active .completion-restart,.completion-enter-active .completion-result,.completion-enter-active .completion-share-feedback,.completion-enter-active .completion-title{transition:opacity .22s .14s,transform .24s cubic-bezier(.16,1,.3,1) .14s}.completion-leave-active .completion-account-actions,.completion-leave-active .completion-actions,.completion-leave-active .completion-restart,.completion-leave-active .completion-result,.completion-leave-active .completion-share-feedback,.completion-leave-active .completion-title{transition:opacity .1s ease-in}.completion-enter-from .completion-account-actions,.completion-enter-from .completion-actions,.completion-enter-from .completion-restart,.completion-enter-from .completion-result,.completion-enter-from .completion-share-feedback,.completion-enter-from .completion-title,.completion-leave-to .completion-account-actions,.completion-leave-to .completion-actions,.completion-leave-to .completion-restart,.completion-leave-to .completion-result,.completion-leave-to .completion-share-feedback,.completion-leave-to .completion-title{opacity:0;transform:translateY(.4rem)}.puzzle-piece{background-color:var(--line);background-image:var(--image-url);background-size:calc(var(--grid-columns) * 100%) calc(var(--grid-rows) * 100%);cursor:grab;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;touch-action:none;border:0;min-width:0;padding:0;transition:filter .12s,box-shadow .12s,transform .1s;position:relative}.puzzle-piece:active{cursor:grabbing}.puzzle-piece:hover{filter:brightness(1.06)}.puzzle-piece.is-placed:after{border:2px solid var(--ink);outline:2px solid var(--paper);background:var(--yellow);width:18px;height:18px;color:var(--yellow-foreground);content:"✓";pointer-events:none;border-radius:50%;place-items:center;font-size:11px;font-weight:900;line-height:1;display:grid;position:absolute;top:.3rem;right:.3rem;box-shadow:0 1px 4px #080f2e73}.puzzle-piece.is-selected{z-index:1;box-shadow:inset 0 0 0 4px var(--yellow),0 0 0 2px var(--coral);filter:brightness(1.08)}.puzzle-piece.is-dragging{z-index:3;cursor:grabbing;filter:brightness(1.1);pointer-events:none;transition:none}.puzzle-piece.is-dragging:before{content:"";pointer-events:none;border:2px dashed #ffffffb8;position:absolute;inset:5px}.puzzle-drag-ghost{z-index:1000;opacity:.97;pointer-events:none;border:2px solid #fff;position:fixed;overflow:hidden;transform:scale(1.04)rotate(1deg);box-shadow:0 8px 24px #080f2e57}.puzzle-drag-ghost.touch{transform:translateY(-14px)scale(1.04)rotate(1deg)}.puzzle-drag-ghost.settling{transition:left .34s cubic-bezier(.2,.8,.2,1),top .34s cubic-bezier(.2,.8,.2,1),transform .34s cubic-bezier(.2,.8,.2,1),box-shadow .34s;transform:none;box-shadow:0 2px 5px #080f2e1f}.puzzle-drag-ghost-image{background-image:var(--image-url);background-size:calc(var(--grid-columns) * 100%) calc(var(--grid-rows) * 100%);width:100%;height:100%}.puzzle-piece.is-drop-target{z-index:2;box-shadow:inset 0 0 0 4px var(--coral),0 0 0 2px var(--yellow)}.puzzle-piece:focus-visible{z-index:2;outline:3px solid var(--yellow);outline-offset:-4px}button:not(.puzzle-piece):disabled:active{transform:none;box-shadow:none!important}@media (width<=600px){.completion-board{width:calc(min(82vw,42svh,420px))}.completion-actions{gap:.25rem .65rem;width:100%}.completion-navigation-actions{gap:.55rem}.completion-archive-link{gap:.5rem;padding-inline:.7rem;font-size:.78rem}}@media (width<=470px){.puzzle-board{gap:2px}.puzzle-piece.is-selected{box-shadow:inset 0 0 0 3px var(--yellow),0 0 0 2px var(--coral)}}@media (prefers-reduced-motion:reduce){.puzzle-board .piece-move{transition:none!important}.completion-enter-active .completion-board,.completion-leave-active .completion-board{transition:opacity .01ms linear!important}.completion-enter-from .completion-board{transform:none}}