.onb{position:absolute;inset:0;z-index:60;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;background:linear-gradient(180deg,#07040B,#2A0A1C 70%,#5A0F1F)}
.onb.light{background:linear-gradient(180deg,var(--sky1),var(--sky2) 70%,#7A1B1B)}
.otop{position:relative;padding:calc(30px + env(safe-area-inset-top,0px)) 22px 6px;text-align:center;color:#fff}
.onb.light .otop{color:var(--ink)}
.otop h1{font-family:var(--f-horror);font-weight:400;font-size:38px;letter-spacing:.02em;line-height:1.05;margin:0;text-wrap:balance;text-shadow:0 3px 0 var(--accent-d),0 0 22px rgba(224,36,58,.6)}
.otop p{margin:8px 0 0;font-size:15px;font-weight:700;opacity:.85;line-height:1.4}
.ofoot{position:relative;padding:14px 20px calc(20px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:10px;margin-top:auto}
.logo{font-family:var(--f-horror);font-weight:400;font-size:64px;line-height:.9;color:#fff;text-align:center;letter-spacing:.02em;text-shadow:0 4px 0 #000,0 0 30px rgba(224,36,58,.7)}
.logo span{color:var(--accent)}
.field{display:flex;flex-direction:column;gap:5px}
.field label{font-weight:900;font-size:13px}
.field input{border:2px solid var(--line);border-radius:14px;padding:12px;font-family:inherit;font-size:16px;font-weight:800;background:var(--surf2);color:var(--ink);width:100%}
.at{display:flex;align-items:center;border:2px solid var(--line);border-radius:14px;background:var(--surf2);padding-left:12px}
.at span{font-weight:900;font-size:18px;color:var(--ink2)}
.at input{flex:1;min-width:0;border:0;background:transparent;padding:12px 12px 12px 3px;font-family:inherit;font-size:17px;font-weight:800;color:var(--ink);outline:none}
.at:focus-within{border-color:var(--blue)}
.err{color:#FF5A6E;font-size:13px;font-weight:800;min-height:17px}
.ok{color:#3DDC84;font-size:13px;font-weight:800;min-height:17px}