/* Login and registration use the light template. */
#loginModal.auth-modal{position:fixed;inset:0;z-index:100000000;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(25,35,48,.56);box-sizing:border-box;overflow:hidden;color-scheme:light}
#loginModal .auth-modal-content{position:relative;box-sizing:border-box;width:500px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 48px);overflow-y:auto;overflow-x:hidden;margin:0;padding:64px 69px 48px;background:#fff;color:#172b42;border-radius:11px;box-shadow:0 18px 55px rgba(0,0,0,.3);scrollbar-width:thin}
#loginModal .auth-modal-close{position:absolute;top:19px;right:27px;width:30px;height:30px;border:0;background:none;color:#8d9baa;font-size:35px;font-weight:300;line-height:26px;cursor:pointer;padding:0}
#loginModal .auth-modal-close:hover{color:#172b42}
#loginModal #login-box{width:100%;max-width:none!important;margin:0;padding:0!important;background:transparent;border:0;border-radius:0!important;overflow:visible}
#loginModal #login-title{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#loginModal #login-box .logo{margin:0 0 32px;text-align:center}
#loginModal #login-box .logo img{display:block;width:180px;max-width:100%;height:64px;object-fit:contain;margin:0 auto}
#loginModal #replica-auth-form{display:block;width:100%;margin:0}
#loginModal #login-box .required.field{margin:0 0 20px}
#loginModal #login-box .ui.fluid.input{display:block;width:100%}
#loginModal #login-box .ui.fluid.input input{display:block;box-sizing:border-box;width:100%!important;height:50px!important;padding:0 18px!important;border:2px solid #e0e3e6!important;border-radius:10px!important;background:#f8f9fa!important;color:#233143!important;font-size:14px!important;line-height:normal!important;outline:none;transition:border-color .15s,box-shadow .15s}
#loginModal #login-box .ui.fluid.input input::placeholder{color:#9aa7b6;opacity:1}
#loginModal #login-box .ui.fluid.input input:focus{border-color:#9bb8d2!important;background:#fff!important;box-shadow:0 0 0 3px rgba(93,143,185,.14)}
#loginModal #login-box .login-options{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;margin:24px 0 28px}
#loginModal #login-box .ui.checkbox{display:flex;position:relative;align-items:center;margin:0;gap:0}
#loginModal #login-box .ui.checkbox label{padding-left:28px;color:#596777;font-size:13px;line-height:22px;font-weight:400;white-space:nowrap;cursor:pointer}
#loginModal #login-box .ui.checkbox input[type=checkbox]{width:20px;height:20px;opacity:0;position:absolute;left:0;top:50%;transform:translateY(-50%);margin:0;cursor:pointer;z-index:1}
#loginModal #login-box .ui.checkbox label:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);box-sizing:border-box;width:20px;height:20px;border:2px solid #ccd3da;border-radius:4px;background:#fff}
#loginModal #login-box .ui.checkbox input:checked+label:before{background:#ff4f82;border-color:#ff4f82}
#loginModal #login-box .ui.checkbox input:checked+label:after{content:"✓";position:absolute;left:4px;top:50%;transform:translateY(-50%);color:#fff;font:700 14px/1 Arial,sans-serif;z-index:2}
#loginModal #login-box .ui.checkbox input:focus-visible+label:before{outline:2px solid #678cae;outline-offset:2px}
#loginModal #login-box .login-btn,#loginModal #login-box .join-btn{display:block;box-sizing:border-box;width:100%;height:50px;min-height:50px;padding:0 16px;border-radius:10px;font-size:16px;font-weight:700;line-height:normal;cursor:pointer}
#loginModal #login-box .login-btn{margin:0;border:0;background:#ff4f82;color:#fff}
#loginModal #login-box .login-btn:disabled{opacity:.55;cursor:wait}
#loginModal #login-box .join-btn{margin:20px 0 0;border:2px solid #ff4f82;background:#fff;color:#ed3d73}
#loginModal #login-box .login-btn:hover:not(:disabled){background:#ef4276}
#loginModal #login-box .join-btn:hover{background:#fff1f5}
#loginModal .replica-form-error{margin:0 0 14px;color:#c72d54!important;font-size:13px;line-height:1.5;overflow-wrap:anywhere}
@media(max-width:600px){
  #loginModal.auth-modal{padding:12px}
  #loginModal .auth-modal-content{width:100%;max-width:500px;max-height:calc(100dvh - 24px);padding:58px 24px 30px;border-radius:10px}
  #loginModal .auth-modal-close{top:17px;right:19px}
  #loginModal #login-box .logo{margin-bottom:28px}
  #loginModal #login-box .ui.fluid.input input{height:48px!important;font-size:16px!important}
  #loginModal #login-box .login-options{gap:12px 8px;margin:22px 0 26px}
  #loginModal #login-box .ui.checkbox label{font-size:12px;padding-left:26px}
  #loginModal #login-box .login-btn,#loginModal #login-box .join-btn{height:48px;min-height:48px}
}
#registerModal.auth-modal{position:fixed;inset:0;z-index:100000000;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(0,0,0,.72);box-sizing:border-box}
#registerModal .register-modal-content{position:relative;box-sizing:border-box;width:500px;height:min(724px,calc(100dvh - 48px));max-width:calc(100vw - 32px);max-height:calc(100dvh - 48px);overflow-y:auto;overflow-x:hidden;margin:0;padding:64px 69px 34px;background:#fff;color:#202124;border-radius:11px;box-shadow:0 18px 55px rgba(0,0,0,.3);scrollbar-width:thin;scrollbar-color:#b9b9b9 transparent}
#registerModal .register-modal-content::-webkit-scrollbar{width:8px}
#registerModal .register-modal-content::-webkit-scrollbar-thumb{background:#b9b9b9;border-radius:8px}
#registerModal .auth-modal-close{position:absolute;top:19px;right:27px;width:30px;height:30px;border:0;background:none;color:#8d9baa;font-size:35px;font-weight:300;line-height:26px;cursor:pointer;padding:0}
#registerModal .auth-modal-close:hover{color:#45515c}
#registerModal .register-title{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
#registerModal #replica-register-form{display:block;width:100%;margin:0}
#registerModal .register-fields{width:100%}
#registerModal .register-row{margin:0 0 27px;padding:0;border:0;min-width:0}
#registerModal .register-row>label,#registerModal .register-label{display:block;margin:0 0 10px;color:#172b42;font-size:14px;font-weight:700;line-height:1.2}
#registerModal .register-row>input{display:block;box-sizing:border-box;width:100%;height:50px;padding:0 18px;border:2px solid #e0e3e6;border-radius:10px;background:#f8f9fa;color:#233143;font:400 14px/48px Arial,"Noto Sans KR",sans-serif;outline:none;transition:border-color .15s,box-shadow .15s}
#registerModal .register-row>input::placeholder{color:#a5adb7;opacity:1}
#registerModal .register-row>input:focus{border-color:#9bb8d2;background:#fff;box-shadow:0 0 0 3px rgba(80,135,180,.12)}
#registerModal .register-gender{margin-top:-2px}
#registerModal .register-gender-options{display:flex;gap:14px;width:100%}
#registerModal .register-gender-options label{position:relative;display:block;flex:1;cursor:pointer}
#registerModal .register-gender-options input{position:absolute;opacity:0;pointer-events:none}
#registerModal .register-gender-options label>span{display:block;box-sizing:border-box;height:50px;border:2px solid #e0e3e6;border-radius:10px;background:#f8f9fa;color:#657182;text-align:center;font-size:14px;line-height:46px}
#registerModal .register-gender-options input:checked+span{border-color:#ff4f82;background:#fff1f5;color:#f23870;font-weight:700}
#registerModal .register-email-row[hidden],#registerModal .register-verification[hidden]{display:none}
#registerModal .register-verification{margin:-1px 0 20px;padding:12px;border:1px solid #e0e3e6;border-radius:10px;background:#fafafa}
#registerModal .register-captcha-label{margin-bottom:8px;color:#172b42;font-size:13px;font-weight:700}
#registerModal .register-captcha{display:grid;grid-template-columns:126px 66px;gap:7px;align-items:center}
#registerModal .register-captcha img{display:block;width:126px;height:42px;border:1px solid #ddd;object-fit:contain;background:#fff}
#registerModal .register-captcha button{height:42px;border:1px solid #d8dde3;border-radius:6px;background:#fff;color:#516273;font-size:12px;cursor:pointer}
#registerModal .register-captcha input{grid-column:1/-1;box-sizing:border-box;width:100%;height:42px;padding:0 12px;border:1px solid #d8dde3;border-radius:6px;background:#fff;color:#223044}
#registerModal .register-consent{margin:4px 0 13px;padding:13px 0;border-top:1px solid #edf0f2;border-bottom:1px solid #edf0f2}
#registerModal .register-consent label{display:flex;align-items:center;gap:8px;min-height:28px;color:#596777;font-size:12px;line-height:1.4}
#registerModal .register-consent input{width:16px;height:16px;accent-color:#ff4f82;flex:none}
#registerModal .register-consent .terms-link{margin-left:auto;padding:0;border:0;background:none;color:#718ba3;font-size:11px;text-decoration:underline;cursor:pointer}
#registerModal .register-terms-text{box-sizing:border-box;max-height:180px;overflow:auto;padding:12px;margin:6px 0 10px;border:1px solid #e0e3e6;border-radius:6px;background:#fafafa;color:#344254;white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;line-height:1.6}
#registerModal [hidden]{display:none!important}
#registerModal .register-gender-options input:focus-visible+span{outline:2px solid #678cae;outline-offset:2px}
#registerModal .replica-form-error{margin:8px 0;font-size:13px;color:#e23f68!important;line-height:1.45;min-height:0}
#registerModal .register-submit{display:block;width:100%;height:48px;margin:8px 0 0;border:0;border-radius:8px;background:#ff4f82;color:#fff;font-size:15px;font-weight:700;cursor:pointer;transition:filter .15s,opacity .15s}
#registerModal .register-submit:hover:not(:disabled){filter:brightness(.96)}
#registerModal .register-submit:disabled{opacity:.45;cursor:not-allowed}
@media (max-width:600px){
  #registerModal.auth-modal{align-items:center;padding:12px}
  #registerModal .register-modal-content{width:100%;height:auto;max-width:none;max-height:calc(100dvh - 24px);padding:58px 24px 25px;border-radius:10px}
  #registerModal .auth-modal-close{top:17px;right:19px}
  #registerModal .register-row{margin-bottom:20px}
  #registerModal .register-row>label,#registerModal .register-label{margin-bottom:8px;font-size:13px}
  #registerModal .register-row>input{height:48px;font-size:16px}
  #registerModal .register-gender-options label>span{height:48px;line-height:44px}
}
