/* Home phone scan and key-ring puzzle. Scoped to the two apartment mini-games. */
.faceid-scene{position:relative;display:grid;place-items:center;min-height:330px;padding:14px 0 28px;overflow:hidden;background:radial-gradient(ellipse at 50% 46%,#d5e9df 0,#86a99f 37%,#385b5a 72%,#172c33 100%);border:1px solid #9cc9bd;border-radius:22px;isolation:isolate}
.faceid-scene:before,.faceid-scene:after{content:"";position:absolute;width:280px;height:280px;border:1px solid #c9f3dc55;border-radius:50%;box-shadow:0 0 0 24px #c9f3dc0c,0 0 0 52px #c9f3dc0c;animation:faceid-pulse 3s ease-in-out infinite}
.faceid-scene:after{width:370px;height:370px;animation-delay:-1.5s}
.faceid-phone{position:relative;z-index:1;width:min(218px,58vw);height:284px;padding:27px 17px 39px;border:5px solid #d9e5dc;border-radius:34px;background:linear-gradient(155deg,#173a40,#10272f 65%,#244c4a);box-shadow:0 18px 38px #07191c88,inset 0 0 0 1px #ffffff4d;overflow:hidden}
.faceid-island{position:absolute;top:8px;left:50%;transform:translateX(-50%);width:68px;height:18px;border-radius:20px;background:#07191e;display:flex;align-items:center;justify-content:flex-end;padding:4px;gap:6px}.faceid-island i:first-child{width:6px;height:6px;border-radius:50%;background:#72d5b2}.faceid-island i:last-child{width:13px;height:7px;border-radius:50%;background:#152b31}
.faceid-head{position:absolute;left:50%;top:56px;transform:translateX(-50%);width:111px;height:156px;border:2px solid #bcf3d39c;border-radius:48% 48% 44% 44% / 40% 40% 53% 53%;background:linear-gradient(140deg,#e5c4a4,#c38e72 56%,#805a53);box-shadow:inset 0 0 0 5px #ffffff0b,0 0 28px #89f0ca31}
.faceid-eye{position:absolute;top:63px;width:8px;height:5px;border-radius:50%;background:#14262a;box-shadow:0 0 0 3px #f5d5b3}.faceid-eye.left{left:27px}.faceid-eye.right{right:27px}.faceid-nose{position:absolute;left:51px;top:69px;width:10px;height:25px;border-right:2px solid #805b52;border-bottom:2px solid #805b52;transform:skew(-8deg);border-radius:0 0 8px}.faceid-mouth{position:absolute;left:40px;top:115px;width:30px;height:9px;border-bottom:2px solid #724848;border-radius:0 0 50% 50%}
.faceid-grid{position:absolute;inset:42px 9px 36px;background:repeating-linear-gradient(0deg,transparent 0 14px,#8ceac81b 15px 16px),repeating-linear-gradient(90deg,transparent 0 14px,#8ceac817 15px 16px);mask-image:linear-gradient(transparent,#000 15%,#000 85%,transparent)}
.faceid-target{position:absolute;z-index:2;left:calc(50% - 79px);top:58px;width:158px;height:158px;transform-origin:center;border-radius:50%;filter:drop-shadow(0 0 7px #c2ffde);pointer-events:none}.faceid-target:before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from var(--face-start),#ddffd9 0deg var(--face-window),transparent var(--face-window) 360deg);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 6px),#000 calc(100% - 5px));mask:radial-gradient(farthest-side,transparent calc(100% - 6px),#000 calc(100% - 5px))}.faceid-target i{position:absolute;right:-4px;top:50%;width:9px;height:9px;transform:translateY(-50%);border-radius:50%;background:#fff;box-shadow:0 0 12px 4px #b2ffd2}
.faceid-beam{position:absolute;z-index:3;left:50%;top:136px;width:79px;height:3px;background:#b9ffe3;box-shadow:0 0 8px 2px #87ffd5,0 0 25px #57e8c9;transform-origin:0 50%;pointer-events:none}.faceid-beam:after{content:"";position:absolute;right:-5px;top:-4px;width:11px;height:11px;border-radius:50%;background:#eeffed;box-shadow:0 0 10px 3px #8dffcf}
.faceid-corner{position:absolute;z-index:4;width:23px;height:23px;border-color:#d4ffdf;border-style:solid;filter:drop-shadow(0 0 4px #83ffd1)}.faceid-corner.tl{left:23px;top:55px;border-width:2px 0 0 2px;border-radius:7px 0 0}.faceid-corner.tr{right:23px;top:55px;border-width:2px 2px 0 0;border-radius:0 7px 0 0}.faceid-corner.bl{left:23px;top:198px;border-width:0 0 2px 2px;border-radius:0 0 0 7px}.faceid-corner.br{right:23px;top:198px;border-width:0 2px 2px 0;border-radius:0 0 7px}
.faceid-caption{position:absolute;bottom:12px;left:5px;right:5px;text-align:center;color:#c1f3dd;font:700 12.6px/1.3 system-ui,sans-serif;letter-spacing:.11em}.faceid-caption.matched{color:#fff3a8}.faceid-orbit{position:absolute;z-index:1;bottom:13px;color:#d7ffe1;font-size:26.6px;text-shadow:0 0 12px #c2ffde}
.faceid-scene{transition:background .18s ease,border-color .18s ease,box-shadow .18s ease}
.faceid-scene.is-match{background:radial-gradient(ellipse at 50% 46%,#dcffe9 0,#4ab27c 38%,#17614d 74%,#102c2d 100%);border-color:#9dffc0;box-shadow:inset 0 0 0 3px #b6ffcf,0 0 24px #35ec8770}
.faceid-scene.is-ready{border-color:#b6ffcf;box-shadow:inset 0 0 0 3px #b6ffcf,0 0 24px #35ec8770}
.faceid-scene.is-ready .faceid-phone{box-shadow:0 0 0 4px #30f18a,0 0 34px #39ff9b,inset 0 0 0 1px #fff8}
.faceid-scene.is-ready .faceid-caption{background:#087448;color:#fff;padding:7px 5px;border-radius:8px;font-size:16.8px}
.faceid-scene.is-ready .faceid-beam{background:#aaffc6;box-shadow:0 0 10px 3px #39ff91,0 0 30px #39ff91}
.faceid-scene.is-miss{background:radial-gradient(ellipse at 50% 46%,#ffe1dd 0,#d95e61 38%,#762f48 74%,#301c30 100%);border-color:#ffaaa3;box-shadow:inset 0 0 0 3px #ffb9ad,0 0 24px #ff454570}
.faceid-scene.is-match .faceid-phone{border-color:#c9ffda;box-shadow:0 0 0 4px #30f18a,0 0 34px #39ff9b,inset 0 0 0 1px #fff8}
.faceid-scene.is-miss .faceid-phone{border-color:#ffd2c9;box-shadow:0 0 0 4px #ff5766,0 0 34px #ff3d69,inset 0 0 0 1px #fff8}
.faceid-scene.is-match .faceid-target{filter:drop-shadow(0 0 11px #45ff9d)}
.faceid-scene.is-miss .faceid-target{filter:drop-shadow(0 0 11px #ff435f)}
.faceid-scene.is-match .faceid-beam{background:#aaffc6;box-shadow:0 0 10px 3px #39ff91,0 0 30px #39ff91}
.faceid-scene.is-miss .faceid-beam{background:#ffb0a5;box-shadow:0 0 10px 3px #ff465e,0 0 30px #ff465e}
.faceid-scene.is-match .faceid-caption,.faceid-scene.is-miss .faceid-caption{left:12px;right:12px;bottom:9px;padding:7px 5px;border-radius:8px;color:#fff;font-size:14px;letter-spacing:.08em;text-shadow:0 1px 2px #102020;background:#087448;box-shadow:0 0 0 1px #baffd3}
.faceid-scene.is-miss .faceid-caption{background:#a52242;box-shadow:0 0 0 1px #ffd0c5}
.faceid-scene.is-match .faceid-head{box-shadow:inset 0 0 0 5px #ffffff20,0 0 0 4px #8dffc7,0 0 30px #54ffad}
.faceid-scene.is-miss .faceid-head{box-shadow:inset 0 0 0 5px #ffffff20,0 0 0 4px #ff827e,0 0 30px #ff526f}
.faceid-feedback{display:inline-block;margin-right:.35em;font-size:1.6em;font-weight:900}
.faceid-scene.is-match .faceid-feedback:before{content:"✓"}
.faceid-scene.is-miss .faceid-feedback:before{content:"×"}
.faceid-scene.is-match .faceid-orbit{color:#aaffc8;text-shadow:0 0 14px #39ff91}
.faceid-scene.is-miss .faceid-orbit{color:#ffaaa3;text-shadow:0 0 14px #ff465e}
.faceid-status{font-weight:800;border:1px solid #94b4a8;border-radius:10px;padding:9px 12px;background:#13272de8;color:#f5fff9;text-align:center}
.faceid-status.is-match{border:2px solid #20bd71;background:#0d5038;color:#fff}
.faceid-status.is-miss{border:2px dashed #ef5267;background:#641f37;color:#fff}
.faceid-status:before{content:"СКАНИРОВАНИЯ · ";font-size:1.1em;letter-spacing:.06em;opacity:.8}
.faceid-status.is-match:after{content:" · ✓ ПОПАДАНИЕ";font-weight:900}
.faceid-status.is-miss:after{content:" · × ПРОМАХ";font-weight:900}
@keyframes faceid-pulse{50%{transform:scale(1.06);opacity:.45}}@keyframes faceid-beam-glow{to{opacity:.58}}
.key-quest{padding:14px;border:1px solid #8a7657;background:linear-gradient(145deg,#372c20,#181a1a 72%);border-radius:18px;color:#f5e8ce}.keyring-art{height:76px;position:relative;display:flex;align-items:center;justify-content:center;gap:14px;margin:-4px auto 12px;color:#f4ce79}.keyring-art i{position:absolute;top:4px;font-style:normal;font-size:56px;transform:rotate(-28deg);color:#c2a66d;text-shadow:0 3px 5px #000}.keyring-art span{position:relative;top:11px;font-size:37.8px;filter:drop-shadow(0 3px 3px #000)}.key-clue{margin:9px 0 12px;padding:11px;border:1px solid #b48a4d88;border-radius:10px;background:#e8b85b13;color:#ffe3a8;font-weight:700;text-align:center}.key-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.key-choice,.key-turn-buttons button{min-height:52px;border:1px solid #c9a76e;border-radius:11px;background:linear-gradient(#59452e,#352a20);color:#fff1d5;font:700 18.2px/1.25 system-ui,sans-serif;touch-action:manipulation}.key-choice:hover,.key-turn-buttons button:hover{background:#735833}.key-choice.wrong{border-color:#e68d7e;animation:key-wrong .22s ease-in-out 2}.key-lock{padding:10px 0}.key-turns{display:flex;justify-content:center;gap:7px;flex-wrap:wrap;margin:9px 0 14px}.key-turn{display:grid;place-items:center;min-width:47px;height:50px;border:1px solid #90754d;border-radius:10px;color:#ffdb94;background:#24201a;font-size:30.8px}.key-turn small{font-size:11.2px;letter-spacing:.08em}.key-turn.done{background:#53704c;border-color:#b5d396;color:#fff}.key-turn-buttons{display:grid;grid-template-columns:1fr 1fr;gap:10px}.key-turn-buttons button{font-size:22.4px;min-height:56px}.key-quest .mini-status{color:#f2ddb6}
@keyframes key-wrong{50%{transform:translateX(4px)}}
@media(max-width:520px){.faceid-scene{min-height:304px}.faceid-phone{transform:scale(.92);margin:-10px 0}.key-choices{grid-template-columns:1fr}.key-choice{min-height:46px}.key-quest{padding:10px}}
@media(prefers-reduced-motion:reduce){.faceid-scene{transition:none}}
@media(prefers-reduced-motion:reduce){.faceid-scene:before,.faceid-scene:after,.faceid-beam,.key-choice.wrong{animation:none}}