body.kc-open{overflow:hidden}
.kc-screen{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:16px;background:linear-gradient(135deg,#4facfe,#7b5cff);z-index:9999;overflow-y:auto;color:#fff;text-align:center;box-sizing:border-box}
.kc-top{position:absolute;top:8px;left:8px;right:8px;display:flex;justify-content:space-between}
.kc-title{font-size:28px;line-height:1.2;font-weight:800;margin:72px 0 0;text-shadow:0 2px 4px rgba(0,0,0,.25)}
.kc-sub{font-size:22px;margin:0}
.kc-photobox{position:relative;display:inline-block}
.kc-photo{display:block;max-height:40vh;max-width:80vw;border-radius:16px;box-shadow:0 10px 30px rgba(0,0,0,.3);background:#fff}
.kc-nophoto{width:160px;height:220px;line-height:220px;font-size:64px;color:#667}
.kc-btn{min-height:72px;min-width:72px;font-size:26px;font-weight:700;border-radius:24px;padding:0 32px;border:0;cursor:pointer;color:#fff;background:#1d4ed8;display:inline-flex;align-items:center;justify-content:center;gap:10px;box-shadow:0 4px 0 rgba(0,0,0,.25)}
.kc-btn:active{transform:translateY(2px)}
.kc-btn.kc-yes{background:#16a34a}
.kc-btn.again{background:#6b7280}
.kc-camera{font-size:44px;min-width:128px;min-height:96px;position:relative;overflow:hidden}
.kc-camera input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}
.kc-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.kc-row{display:flex;gap:16px;flex-wrap:wrap;justify-content:center}
.kc-replay,.kc-close{width:72px;height:72px;border-radius:50%;border:0;font-size:32px;background:rgba(255,255,255,.35);color:#fff;cursor:pointer}
.kc-ring{position:absolute;left:14%;top:56%;width:20%;aspect-ratio:1;transform:translate(-50%,-50%);border:6px solid #ffd60a;border-radius:50%;box-shadow:0 0 12px #ffd60a;animation:kc-pulse 1s ease-in-out infinite;pointer-events:none}
@keyframes kc-pulse{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:1}50%{transform:translate(-50%,-50%) scale(1.5);opacity:.5}}
.kc-spinner{width:64px;height:64px;border:8px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:kc-spin 1s linear infinite}
@keyframes kc-spin{to{transform:rotate(360deg)}}
.kc-confetti-field{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.kc-confetti{position:absolute;top:-20px;width:12px;height:12px;border-radius:3px;background:#ffd60a;animation:kc-fall 2.4s ease-in infinite}
.kc-confetti:nth-child(3n){background:#ff4d6d}.kc-confetti:nth-child(3n+1){background:#4ade80}.kc-confetti:nth-child(5n){background:#fff}
@keyframes kc-fall{to{transform:translateY(110vh) rotate(720deg)}}
.kc-open-btn{min-height:64px}
@media (prefers-reduced-motion:reduce){.kc-ring,.kc-confetti,.kc-spinner{animation:none}.kc-confetti{display:none}}
@media (min-width:768px){.kc-title{font-size:46px}.kc-sub{font-size:32px}.kc-btn{min-height:96px;font-size:34px;padding:0 56px}.kc-photo{max-height:45vh}.kc-replay,.kc-close{width:88px;height:88px}}
.angle-reference{text-align:center;margin:0 0 8px}.angle-reference img{max-height:220px;border-radius:12px}.angle-reference small{display:block}#modal .angle-take{background:#1d4ed8;color:#fff;width:100%;min-height:72px;font-size:24px;margin:8px 0}.angle-take input{position:absolute;inset:0;opacity:0;width:100%;height:100%}#modal .angle-choose,#modal .angle-choose.button{display:flex;min-height:64px;align-items:center;justify-content:center;cursor:pointer}
.kc-wiggle{position:fixed;inset:0;background:#000;z-index:10000;display:flex;flex-direction:column;overflow:hidden;color:#fff;text-align:center}
.kc-wiggle video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.kc-wiggle-outline{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);aspect-ratio:5/7;height:62%;max-width:80%;border:6px dashed #ffd60a;border-radius:18px;box-shadow:0 0 0 100vmax rgba(0,0,0,.35);pointer-events:none}
.kc-wiggle-title{position:absolute;top:72px;left:16px;right:16px;margin:0;font-size:28px;font-weight:800;text-shadow:0 2px 4px rgba(0,0,0,.5)}
.kc-wiggle-close{position:absolute;top:8px;right:8px}
.kc-wiggle-progress{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);width:120px;height:120px}
.kc-wiggle-progress circle.track{stroke:rgba(255,255,255,.35)}
.kc-wiggle-progress circle.bar{stroke:#ffd60a;stroke-width:10;fill:none;stroke-dasharray:339.3;stroke-dashoffset:339.3;transform:rotate(-90deg);transform-origin:center;transition:stroke-dashoffset .12s linear}
@media (min-width:768px){.kc-wiggle-title{font-size:46px}}
@media (prefers-reduced-motion:reduce){.kc-wiggle-progress circle.bar{transition:none}}