.loopy-sign-in{--sign-in-art:min(300px,72vw);width:min(440px,100%);padding-top:calc(var(--sign-in-art)*.895);color:#f3eef8;font:600 15px/1.5 var(--font-playloo);box-sizing:border-box;margin:24px auto 40px;position:relative}.loopy-sign-in *{box-sizing:border-box}.loopy-sign-in__mascot{top:calc(var(--sign-in-art)*.015);width:var(--sign-in-art);height:var(--sign-in-art);z-index:2;pointer-events:none;object-fit:contain;position:absolute;left:50%;transform:translate(-50%)}.loopy-sign-in__panel{background:linear-gradient(145deg,#30263c,#221b2c);border:1px solid #685277;border-radius:26px;padding:40px 30px 24px;position:relative;box-shadow:0 24px 80px #0006,inset 0 1px #ffffff14}.loopy-sign-in__eyebrow{text-align:center;letter-spacing:2.2px;color:#d8ff62;margin:0 0 7px;font-size:10px;font-weight:700}.loopy-sign-in h1{text-align:center;letter-spacing:-1.8px;margin:0 0 12px;font-size:38px;line-height:1.1}.loopy-sign-in__intro{text-align:center;color:#c8bad4;margin:0 0 24px}.loopy-sign-in label{margin:14px 0 7px;font-size:13px;font-weight:600;display:block}.loopy-sign-in input:not([type=hidden]),.loopy-sign-in button{width:100%;min-height:48px;font:inherit;border-radius:12px}.loopy-sign-in input:not([type=hidden]){color:#fff;background:#18141f;border:1px solid #62516f;padding:12px 14px;font-size:16px;transition:border-color .15s,box-shadow .15s}.loopy-sign-in input:focus-visible{border-color:#d8ff62;outline:0;box-shadow:0 0 0 3px #d8ff6220}.loopy-sign-in button{cursor:pointer;font-weight:700}.loopy-sign-in button:disabled,.loopy-sign-in button[aria-disabled=true]{cursor:default;opacity:.5}.loopy-sign-in button:focus-visible{outline-offset:4px;outline:3px solid #fff}.loopy-sign-in__submit{color:#172000;background:#d8ff62;border:1px solid #e3ff91;margin-top:18px;box-shadow:0 4px 18px #caff3d12}.loopy-sign-in__google{color:#292331;background:#fff;border:1px solid #e7e0ec;justify-content:center;align-items:center;gap:12px;margin-top:20px;display:flex}.loopy-sign-in__divider{color:#aa9bb9;align-items:center;gap:12px;margin:22px 0 4px;font-size:12px;display:flex}.loopy-sign-in__divider:before,.loopy-sign-in__divider:after{content:"";background:#ffffff20;flex:1;height:1px}.loopy-sign-in__note{color:#bbaec8;margin:9px 0 0;font-size:12px;line-height:1.6}.loopy-sign-in__privacy{color:#a99ab6;border-top:1px solid #ffffff14;margin:22px 0 0;padding-top:16px;font-size:11px;line-height:1.6}.loopy-sign-in__error{color:#ffc5b9;margin:14px 0 0;font-size:13px}.loopy-sign-in__sent{text-align:center;line-height:1.6}.loopy-sign-in__sent h2{margin:6px 0 10px;font-size:23px}.loopy-sign-in__mail{color:#d8ff62;font-size:42px;display:block}.loopy-sign-in .loopy-sign-in__text-button{color:#d8ff62;background:0 0;border:0;min-height:44px;margin-top:10px;font-size:12px;text-decoration:underline}.loopy-sign-in--embedded{--sign-in-art:min(215px,54vw);margin:8px auto 20px}.loopy-sign-in--embedded .loopy-sign-in__panel{padding-top:33px}@media (max-width:480px){.loopy-sign-in{--sign-in-art:min(230px,65vw);margin:16px auto 24px}.loopy-sign-in__panel{border-radius:22px;padding:35px 22px 22px}.loopy-sign-in h1{font-size:34px}.loopy-sign-in__intro{margin-bottom:18px;font-size:13px}.loopy-sign-in--embedded{--sign-in-art:min(190px,52vw)}}@media (prefers-reduced-motion:reduce){.loopy-sign-in input{transition:none}}.loopy-sign-in__nickname-warning{color:#ff9f9f;margin:9px 0 0;font-size:12px;line-height:1.6}.loopy-sign-in__nickname.is-invalid input{border-color:#ff9f9f;outline:0;box-shadow:0 0 0 3px #ff9f9f33}
