/* Shadows are cached canvas silhouettes, never live CSS blur filters.
   Only the paper face is clipped: this preserves precise notch hit testing. */
.fp-viewport {
  position: relative; isolation: isolate; width: 100%; height: 100%; min-height: 320px; overflow: hidden;
  background-color: #c6a477;
  background-image: linear-gradient(115deg, rgba(255,248,224,.10), rgba(73,43,19,.08)), url('images/puzzle-oak-table-v1.webp');
  background-position: center; background-size: cover;
  box-shadow: inset 0 2px 8px #51301618;
  touch-action: none; user-select: none; -webkit-user-select: none; overscroll-behavior: contain; cursor: grab; outline-offset: -3px;
}
.fp-viewport:focus-visible { outline: 3px solid #1769ed; }
.fp-world { position: absolute; left: 0; top: 0; transform-origin: 0 0; background: transparent; box-shadow: none; will-change: transform; }
.fp-group {
  position: absolute; left: 0; top: 0; width: 0; height: 0; pointer-events: none;
}
.fp-group[hidden] { display: none !important; }
.fp-scene { position: absolute; left: 0; top: 0; pointer-events: none; }
.fp-group-shadow { position: absolute; display: block; z-index: 0; pointer-events: none; }
.fp-shadow-lifted { display: none; }
.fp-group.is-dragging .fp-shadow-rest { display: none; }
.fp-group.is-dragging .fp-shadow-lifted { display: block; }
.fp-piece {
  position: absolute; display: block; z-index: 2; appearance: none; -webkit-appearance: none;
  padding: 0; margin: 0; border: 0; border-radius: 0; outline: none; min-width: 0; min-height: 0;
  background: transparent; color: #152541; cursor: grab; touch-action: none; pointer-events: auto;
  user-select: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent; transform-origin: center;
}
.fp-piece canvas { display: block; width: 100%; height: 100%; pointer-events: none; }
.fp-piece:focus-visible { background: rgba(25,104,231,.25); }
/* Increase only elevation on grab; leave geometry glued 1:1 to the pointer. */
.fp-group.is-dragging { will-change: transform; }
.fp-group.is-dragging .fp-piece { cursor: grabbing; }
.fp-viewport.is-panning, .fp-viewport.is-panning .fp-piece { cursor: grabbing; }
.fp-viewport.is-paused .fp-piece { cursor: default; }
@media (prefers-reduced-motion: reduce) { .fp-viewport, .fp-world, .fp-group, .fp-piece { scroll-behavior: auto !important; animation: none !important; transition: none !important; } }