#pinScreen{position:fixed;inset:0;background:#ffffff;display:flex;align-items:center;justify-content:center;z-index:1000}
.pin-panel{background:#117ACA;border:none;border-radius:16px;padding:40px 36px;width:340px;text-align:center}
.pin-logo{color:#ffffff;font-size:22px;font-weight:700;letter-spacing:1px;margin-bottom:4px;font-family:'Inter',Arial,sans-serif}
.pin-sub{color:#ffffff;font-size:12px;margin-bottom:28px;letter-spacing:.5px;opacity:.85}
.pin-lock{font-size:30px;margin-bottom:16px}
.pin-dots{display:flex;justify-content:center;gap:10px;margin-bottom:24px}
.pin-dot{width:14px;height:14px;border-radius:50%;border:2px solid rgba(255,255,255,0.5);background:transparent;transition:all .2s}
.pin-dot.filled{background:#ffffff;border-color:#ffffff}
.pin-dot.error{background:#e53935;border-color:#e53935}
.pin-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}
.pin-btn{background:#0d6aad;color:#ffffff;border:1px solid rgba(255,255,255,0.2);border-radius:8px;padding:16px;font-size:20px;font-weight:600;cursor:pointer;transition:background .15s,transform .1s;font-family:'Inter',Arial,sans-serif}
.pin-btn:hover{background:#0a5a94}
.pin-btn:active{transform:scale(0.95);background:#083f6b}
.pin-enter{background:#ffffff;color:#117ACA;border:none;border-radius:8px;padding:14px;font-size:13px;font-weight:700;cursor:pointer;width:100%;margin-top:4px;letter-spacing:.8px;transition:background .2s;font-family:'Inter',Arial,sans-serif}
.pin-enter:hover{background:#f0f5ff}
.pin-error{color:#ffffff;font-size:12px;margin-top:10px;min-height:16px;letter-spacing:.3px;opacity:.9}
@keyframes shake{0%,100%{transform:translateX(0)}20%,60%{transform:translateX(-8px)}40%,80%{transform:translateX(8px)}}
.shake{animation:shake .4s ease}

/* ── NEW PIN GATE STYLES (menu.html) ── */
#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,.25)}
.pin-logo{color:#fff;font-size:24px;font-weight:700;letter-spacing:1px;margin-bottom:4px;font-family:'Inter',Arial,sans-serif}
.pin-logo .pin-dot{color:#1e6fff}
.pin-sub{color:rgba(255,255,255,.7);font-size:11px;margin-bottom:28px;letter-spacing:.5px}
.pin-label{color:rgba(255,255,255,.85);font-size:12px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;margin-bottom:16px}
.pin-dots{display:flex;justify-content:center;gap:10px;margin-bottom:20px}
.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:#117ACA;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:#0d5a96}
.pin-btn:active{transform:scale(.95);background:#083f6b}
.pin-clear{background:#0d3a6e;font-size:18px}
.pin-clear:hover{background:#0a2d57}
.pin-enter{background:#fff;color:#1a2b4a;font-size:18px}
.pin-enter:hover{background:#e8f0ff}
.pin-notice{color:rgba(255,255,255,.4);font-size:10px;margin-top:20px;line-height:1.7;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}
