.cg-overlay { position: fixed; inset: 0; background: rgba(10, 12, 18, 0.72); backdrop-filter: blur(4px);
  display: grid; place-items: center; z-index: 50; animation: cg-fade .18s ease-out; }
@keyframes cg-fade { from { opacity: 0 } to { opacity: 1 } }
.cg-card { background: #fff; border-radius: 14px; padding: 26px 28px 18px; width: 320px;
  box-shadow: 0 24px 70px rgba(0,0,0,.35); font-family: -apple-system, system-ui, sans-serif; color: #1c2733; }
.cg-title { font-size: 17px; font-weight: 700; letter-spacing: -.01em }
.cg-sub { font-size: 12.5px; color: #66717f; margin: 4px 0 18px }
.cg-ref { font-size: 10px; color: #9aa4b0; text-align: center; margin-top: 14px; border-top: 1px solid #eef1f4; padding-top: 8px }

.cg-hold-btn { position: relative; width: 100%; height: 64px; border: 0;
  border-radius: 999px; /* PX capsule */
  background: #35404d; overflow: hidden; cursor: pointer; touch-action: none; user-select: none;
  display: grid; place-items: center; box-shadow: 0 2px 8px rgba(20,30,45,.25); }
.cg-hold-fill { position: absolute; inset: 0; background: #21a35c; transform-origin: left; transform: scaleX(0); }
.cg-hold-label { position: relative; font-size: 13px; font-weight: 700; letter-spacing: .09em;
  color: #fff; }

.cg-jigsaw { user-select: none; }
.cg-scene-wrap { position: relative; border-radius: 8px; overflow: hidden; }
.cg-scene { display: block; width: 100%; height: auto; }
.cg-piece { position: absolute; pointer-events: none; filter: drop-shadow(0 3px 6px rgba(0,0,0,.35)); }
.cg-check { position: absolute; inset: 0; display: grid; place-items: center; font-size: 44px; color: #fff;
  text-shadow: 0 1px 10px rgba(33,163,92,.9); }
.cg-track { position: relative; height: 46px; margin-top: 14px; background: #eef2f6; border-radius: 23px;
  touch-action: none; }
.cg-track-fill { position: absolute; left: 3px; top: 3px; bottom: 3px; background: #d9ecff; border-radius: 20px 0 0 20px; }
.cg-handle { position: absolute; top: 4px; width: 38px; height: 38px; border-radius: 50%;
  background: #2b6cd4; color: #fff; display: grid; place-items: center; font-size: 17px; cursor: grab;
  touch-action: none; box-shadow: 0 2px 6px rgba(30,90,190,.4); }
.cg-handle.dragging { cursor: grabbing; transform: scale(1.05); }
.cg-handle.done { background: #21a35c; cursor: default; }
.cg-tries { font-size: 11px; color: #8a95a2; text-align: center; margin-top: 10px; min-height: 14px }


.cg-overlay { z-index: 2147483647; font-family: system-ui, sans-serif; }
.cg-continue { display: block; margin: 16px auto 0; background: transparent; border: 0; color: white; cursor: pointer; }