#dosug-pwa-pin-lock { display: none; }
html.dosug-pwa-lock-pending body { overflow: hidden !important; }
html.dosug-pwa-lock-pending body > :not(#dosug-pwa-pin-lock) {
  filter: blur(18px) brightness(.18) saturate(.35) !important;
  pointer-events: none !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}
html.dosug-pwa-lock-pending #dosug-pwa-pin-lock {
  -webkit-backdrop-filter: blur(26px) brightness(.22) saturate(.35);
  backdrop-filter: blur(26px) brightness(.22) saturate(.35);
  background: rgba(2,4,9,.58) !important;
  isolation: isolate;
}
html.dosug-pwa-lock-pending #dosug-pwa-pin-lock,
html.dosug-pwa-lock-pending #dosug-pwa-pin-lock[hidden] {
  position: fixed; inset: 0; z-index: 2147483000; display: grid !important;
  place-items: center; padding: max(20px, env(safe-area-inset-top)) 16px max(20px, env(safe-area-inset-bottom));
  box-sizing: border-box; background: rgba(2,4,9,.58); color: #f7f8fb;
  font-family: Arial,Helvetica,sans-serif; overflow-y: auto;
}
html.dosug-pwa-unlocked #dosug-pwa-pin-lock { display: none !important; }
#dosug-pwa-pin-lock * { box-sizing: border-box; }
#dosug-pwa-pin-lock .dosug-pwa-pin-card {
  width: min(100%, 390px); padding: 30px 24px 24px; border-radius: 24px;
  border: 1px solid rgba(111,153,224,.35);
  background: radial-gradient(120% 90% at 50% 0%,rgba(56,105,180,.22),transparent 55%),linear-gradient(155deg,#1b2638,#111927 65%,#0d1420);
  box-shadow: 0 24px 80px rgba(0,0,0,.48),0 0 35px rgba(61,112,190,.12);
  text-align: center;
}
#dosug-pwa-pin-lock .dosug-pwa-pin-mark {
  display: inline-grid; place-items: center; width: 70px; height: 70px; margin: 0 auto 14px;
  border-radius: 20px; color: #f5f8ff; background: linear-gradient(145deg,#365b91,#203b63);
  border: 1px solid rgba(190,215,255,.28); box-shadow: 0 8px 25px rgba(0,0,0,.28);
  font-size: 31px; font-weight: 800;
}
#dosug-pwa-pin-lock .dosug-pwa-pin-mark img { display:block; width:58px; height:58px; border-radius:14px; object-fit:contain; }
#dosug-pwa-pin-lock h1 { margin: 0 0 9px; color: #fff; font-size: 24px; line-height: 1.2; font-weight: 800; }
#dosug-pwa-pin-lock .dosug-pwa-pin-description { margin: 0 0 22px; color: #c3ccdb; font-size: 14px; line-height: 1.5; }
#dosug-pwa-pin-lock .dosug-pwa-pin-field { display: block; margin: 0 0 13px; text-align: left; }
#dosug-pwa-pin-lock .dosug-pwa-pin-field span { display: block; margin: 0 0 7px; color: #e8edf6; font-size: 13px; font-weight: 700; }
#dosug-pwa-pin-lock input {
  width: 100%; height: 54px; padding: 10px 16px; border: 1px solid rgba(178,198,230,.25);
  border-radius: 13px; outline: none; background: rgba(4,10,20,.65); color: #fff;
  font-size: 23px; font-weight: 700; letter-spacing: .48em; text-align: center;
  -webkit-appearance: none; appearance: none;
}
#dosug-pwa-pin-lock input:focus { border-color: #7fa9e9; box-shadow: 0 0 0 3px rgba(89,143,219,.16); }
#dosug-pwa-pin-lock .dosug-pwa-pin-submit,
#dosug-pwa-pin-lock .dosug-pwa-pin-secondary {
  width: 100%; min-height: 49px; border-radius: 13px; padding: 12px 16px;
  font-size: 14px; line-height: 1.25; font-weight: 800; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
#dosug-pwa-pin-lock .dosug-pwa-pin-submit { margin-top: 5px; border: 1px solid #6f9cdb; color: #fff; background: linear-gradient(180deg,#4778b8,#315b94); box-shadow: 0 7px 20px rgba(38,83,145,.28); }
#dosug-pwa-pin-lock .dosug-pwa-pin-submit.is-loading { opacity: .75; cursor: wait; }
#dosug-pwa-pin-lock .dosug-pwa-pin-submit:disabled { opacity: .55; cursor: not-allowed; }
#dosug-pwa-pin-lock .dosug-pwa-pin-secondary { margin-top: 10px; border: 1px solid rgba(255,255,255,.13); color: #d8e2f2; background: rgba(255,255,255,.05); }
#dosug-pwa-pin-lock .dosug-pwa-pin-error { margin: 13px 0 0; color: #ff9ca8; font-size: 13px; line-height: 1.4; }
#dosug-pwa-pin-lock [hidden] { display: none !important; }
@media (max-width: 520px) {
  #dosug-pwa-pin-lock { padding-left: 15px; padding-right: 15px; }
  #dosug-pwa-pin-lock .dosug-pwa-pin-card { padding: 26px 20px 21px; border-radius: 21px; }
  #dosug-pwa-pin-lock h1 { font-size: 22px; }
}
@media (prefers-reduced-motion: reduce) { #dosug-pwa-pin-lock * { transition: none !important; } }