.props-ui .jigsaw{--cell: 36px;width:100%;min-width:0;display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(10px,3vw,18px);touch-action:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;border-radius:10px}.props-ui .jigsaw:focus-visible{outline-offset:6px}.props-ui .jigsaw .frame{position:relative;z-index:2;width:calc(var(--w) * var(--cell));height:calc(var(--h) * var(--cell));margin-inline:auto}.props-ui .jigsaw .slot{position:absolute;left:calc(var(--tx) * var(--cell));top:calc(var(--ty) * var(--cell));width:var(--cell);height:var(--cell);background:#24170d;box-shadow:inset 0 3px 6px #0000008c,inset 0 0 0 1px #00000073}.props-ui .piece{--pc: var(--cell);position:relative;flex:none;width:calc(var(--sw) * var(--pc));height:calc(var(--sh) * var(--pc));filter:drop-shadow(0 2px 0 #4a2e19) drop-shadow(0 4px 5px rgba(0,0,0,.4));cursor:grab;pointer-events:none}.props-ui .piece .jt{pointer-events:auto}.props-ui .frame .piece{position:absolute;left:0;top:0;z-index:1;transform:translate(calc(var(--px) * var(--cell)),calc(var(--py) * var(--cell)));transition:transform .12s cubic-bezier(.3,1.2,.55,1)}.props-ui .frame .piece.dragging{z-index:5;cursor:grabbing;transition:none;filter:drop-shadow(0 6px 0 rgba(74,46,25,.8)) drop-shadow(0 12px 14px rgba(0,0,0,.5))}.props-ui .frame .piece.held{z-index:4}.props-ui .jt{--cut: rgba(40, 24, 12, .85);--line: rgba(0, 0, 0, .35);position:absolute;left:calc(var(--tx) * var(--pc));top:calc(var(--ty) * var(--pc));width:var(--pc);height:var(--pc);background-color:var(--tc);background-position:center;box-shadow:inset 0 var(--ct, 0px) 0 var(--cut),inset calc(-1 * var(--cr, 0px)) 0 0 var(--cut),inset 0 calc(-1 * var(--cb, 0px)) 0 var(--cut),inset var(--cl, 0px) 0 0 var(--cut),inset 0 var(--lt, 0px) 0 var(--line),inset calc(-1 * var(--lr, 0px)) 0 0 var(--line),inset 0 calc(-1 * var(--lb, 0px)) 0 var(--line),inset var(--ll, 0px) 0 0 var(--line)}.props-ui .jt.cut-t{--ct: 2px}.props-ui .jt.cut-r{--cr: 2px}.props-ui .jt.cut-b{--cb: 2px}.props-ui .jt.cut-l{--cl: 2px}.props-ui .jt.line-t{--lt: 1px}.props-ui .jt.line-r{--lr: 1px}.props-ui .jt.line-b{--lb: 1px}.props-ui .jt.line-l{--ll: 1px}.props-ui .jt.half-9{clip-path:polygon(-1px -1px,calc(100% + 1px) -1px,-1px calc(100% + 1px))}.props-ui .jt.half-3{clip-path:polygon(-1px -1px,calc(100% + 1px) -1px,calc(100% + 1px) calc(100% + 1px))}.props-ui .jt.half-6{clip-path:polygon(calc(100% + 1px) -1px,calc(100% + 1px) calc(100% + 1px),-1px calc(100% + 1px))}.props-ui .jt.half-12{clip-path:polygon(-1px -1px,calc(100% + 1px) calc(100% + 1px),-1px calc(100% + 1px))}.props-ui .jt[class*=half-]:after{content:"";position:absolute;inset:0;--band: transparent calc(50% - 2.5px) , var(--cut) calc(50% - 2.5px) calc(50% + 2.5px) , transparent calc(50% + 2.5px) ;transition:opacity .6s ease}.props-ui .jt.half-9:after,.props-ui .jt.half-6:after{background:linear-gradient(to bottom right,var(--band))}.props-ui .jt.half-3:after,.props-ui .jt.half-12:after{background:linear-gradient(to bottom left,var(--band))}.props-ui .jt.pat-dots{background-image:radial-gradient(circle,rgba(0,0,0,.3) 0 16%,transparent 19%);background-size:calc(var(--pc) / 2) calc(var(--pc) / 2)}.props-ui .jt.pat-grid{background-image:linear-gradient(rgba(255,255,255,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.16) 1px,transparent 1px);background-size:calc(var(--pc) / 3) calc(var(--pc) / 3)}.props-ui .jt.pat-hatch{background-image:repeating-linear-gradient(45deg,rgba(0,0,0,.2) 0 2px,transparent 2px 7px),repeating-linear-gradient(-45deg,rgba(0,0,0,.2) 0 2px,transparent 2px 7px)}.props-ui .jt.pat-rings{background-image:repeating-radial-gradient(circle,rgba(0,0,0,.28) 0 2px,transparent 2px 6px)}.props-ui .piece-label{position:absolute;left:calc(var(--tx) * var(--pc) + 3px);top:calc(var(--ty) * var(--pc) + 3px);min-width:calc(var(--pc) * .42);padding:0 2px;border-radius:3px;background:#efe4cce0;color:var(--char);font-family:var(--font-display);font-weight:800;font-size:max(10px,calc(var(--pc) * .36));line-height:1.15;text-align:center;pointer-events:none}.props-ui .piece-label.mid{left:calc(var(--tx) * var(--pc));top:calc(var(--ty) * var(--pc));translate:-50% -50%}.props-ui .piece.selected,.props-ui .piece.hinted{filter:drop-shadow(2px 0 0 var(--torch)) drop-shadow(-2px 0 0 var(--torch)) drop-shadow(0 2px 0 var(--torch)) drop-shadow(0 -2px 0 var(--torch))}.props-ui .piece.held{filter:drop-shadow(2px 0 0 var(--torch)) drop-shadow(-2px 0 0 var(--torch)) drop-shadow(0 2px 0 var(--torch)) drop-shadow(0 -2px 0 var(--torch)) drop-shadow(0 8px 10px rgba(0,0,0,.55))}.props-ui .piece.held.blocked .jt{opacity:.6}.props-ui .piece.hinted{animation:piece-hint .9s ease-in-out 2}@keyframes piece-hint{50%{opacity:.55}}.props-ui .jigsaw .ghost{position:absolute;left:0;top:0;z-index:3;transform:translate(calc(var(--px) * var(--cell)),calc(var(--py) * var(--cell)));pointer-events:none}.props-ui .jigsaw .ghost[hidden]{display:none}.props-ui .ghost-sq{position:absolute;left:calc(var(--tx) * var(--cell));top:calc(var(--ty) * var(--cell));width:var(--cell);height:var(--cell);outline:2px dashed var(--torch);outline-offset:-3px}.props-ui .ghost.preview .ghost-sq{outline-style:solid;outline-color:#efe4cc8c}.props-ui .ghost .ghost-half{max-width:none;outline:none;overflow:visible}.props-ui .ghost-half polygon{fill:none;stroke:var(--torch);stroke-width:2px;stroke-dasharray:5 4;vector-effect:non-scaling-stroke}.props-ui .ghost.preview .ghost-half polygon{stroke:#efe4cc8c;stroke-dasharray:none}.props-ui .jigsaw .tray{min-height:calc(var(--cell) * 1.6);display:flex;flex-wrap:wrap;gap:calc(var(--cell) * .22);align-items:center;justify-content:center;align-content:flex-start}.props-ui .jigsaw .reference{--pc: calc(var(--cell) * .3);flex:none;order:0;margin:0 calc(var(--cell) * .2) 0 0;display:grid;gap:3px;justify-items:center;font-size:var(--step--1);line-height:1.1;color:var(--char);font-weight:700}.props-ui .jigsaw .reference-art{position:relative;width:calc(var(--w) * var(--pc));height:calc(var(--h) * var(--pc))}.props-ui .tray .piece{--pc: calc(var(--cell) * var(--tray-scale))}.props-ui.is-solved .frame .piece{filter:none}.props-ui.is-solved .frame .jt{--ct: 0px;--cr: 0px;--cb: 0px;--cl: 0px;transition:box-shadow .6s ease}.props-ui.is-solved .frame .jt:after{opacity:0}.props-ui.is-solved .piece-label{opacity:0;transition:opacity .3s ease}.props-ui .jigsaw.edge-bump .frame{animation:jigsaw-bump .18s ease}@keyframes jigsaw-bump{40%{translate:0 2px}}@media(prefers-reduced-motion:reduce){.props-ui .frame .piece{transition:none}.props-ui .piece.hinted,.props-ui .jigsaw.edge-bump .frame{animation:none}}