/* ═══════════════════════════════════════
   68888.tech  |  PIN Gate Styles
   assets/css/pin.css
═══════════════════════════════════════ */
#pinGate{position:fixed;inset:0;background:#f4f6f9;display:flex;align-items:center;justify-content:center;z-index:1000}
.pin-wrap{background:#1a2b4a;border-radius:16px;padding:40px 36px;width:360px;text-align:center;box-shadow:0 12px 40px rgba(0,0,0,.28)}
.pin-logo{font-size:28px;font-weight:700;letter-spacing:0;margin-bottom:4px;font-family:'Inter',Arial,sans-serif}
.pin-logo .gold{color:#C9A84C}
.pin-logo .wht{color:#ffffff}
.pin-tagline-en{color:rgba(255,255,255,.6);font-size:11px;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:3px}
.pin-tagline-cn{color:#C9A84C;font-size:12px;letter-spacing:1px;margin-bottom:26px}
.pin-label-en{color:rgba(255,255,255,.85);font-size:12px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;margin-bottom:3px}
.pin-label-cn{color:#C9A84C;font-size:11px;letter-spacing:.5px;margin-bottom:14px}
.pin-dots{display:flex;justify-content:center;gap:18px;margin-bottom:22px}
.pin-dot-el{width:14px;height:14px;border-radius:50%;border:2px solid rgba(255,255,255,.35);background:transparent;transition:all .18s;display:block}
.pin-dot-el.filled{background:#fff;border-color:#fff}
.pin-dot-el.error{background:#e53935;border-color:#e53935}
.pin-error{color:rgba(255,100,100,.9);font-size:12px;margin-top:8px;min-height:16px;letter-spacing:.3px}
.pin-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px}
.pin-btn{background:#1558a8;color:#fff;border:1px solid rgba(255,255,255,.15);border-radius:8px;padding:16px;font-size:20px;font-weight:600;cursor:pointer;transition:all .15s;font-family:'Inter',Arial,sans-serif}
.pin-btn:hover{background:#1e6fff}
.pin-btn:active{transform:scale(.95)}
.pin-clear{background:#0d3a6e;font-size:18px}
.pin-clear:hover{background:#0a2d57}
.pin-enter{background:#C9A84C;color:#1a2b4a;font-size:18px;font-weight:700;border:none}
.pin-enter:hover{background:#d4a93a}
.pin-notice{color:rgba(255,255,255,.32);font-size:10px;margin-top:18px;line-height:1.8;letter-spacing:.3px}
@keyframes shake{0%,100%{transform:translateX(0)}20%,60%{transform:translateX(-8px)}40%,80%{transform:translateX(8px)}}
.shake{animation:shake .4s ease}