@font-face{font-family:Nanum;src:url('/web/fonts/NanumGothic.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Nanum;src:url('/web/fonts/NanumGothicBold.ttf') format('truetype');font-weight:700;font-display:swap}
:root{font-family:Nanum,system-ui,sans-serif;color:#071d3b;background:#eaf8fb;--teal:#009fa5;--line:#d9dfe7}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 20% 16%,#effcf5 0,transparent 58%),linear-gradient(130deg,#f2fcf8,#e1f2ff)}button,input{font:inherit}button{cursor:pointer}svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid #48bfc6;outline-offset:4px}[hidden]{display:none!important}
.welcome{min-height:100svh;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(390px,1fr);align-items:center;gap:32px;padding:6vh 5vw 6vh 0;max-width:1920px;margin:auto}.hero{align-self:stretch;min-height:660px;position:relative;overflow:hidden;border-radius:0 0 48% 16%/0 0 8% 5%}.brand{position:absolute;top:0;left:5.4%;display:flex;align-items:center;color:#233e32;font-size:20px;font-weight:650;letter-spacing:-1px;white-space:nowrap;text-decoration:none;z-index:2}.brand .soop-brand>span{font-size:inherit;color:#1c6448}.hero-copy{position:relative;z-index:1;padding:108px 5% 0 13%}.hero h1{font-size:clamp(36px,3.6vw,62px);line-height:1.35;letter-spacing:-2.5px;margin:0 0 20px;font-weight:700}.hero-copy p{font-size:clamp(18px,1.7vw,28px);line-height:1.65;color:#3e4d63;margin:0;letter-spacing:-.6px}.illustration{position:absolute;left:0;bottom:0;width:100%;height:49%;pointer-events:none}.illustration svg{width:100%;height:100%;stroke:none;overflow:hidden}.illustration{mask-image:linear-gradient(to bottom,transparent,#000 5%,#000)}.hero-dots{position:absolute;right:10%;top:19%;width:68px;height:72px;background:radial-gradient(circle,#f1b4a7 3px,transparent 4px) 0 0/18px 18px;opacity:.8}
.entry-card{width:100%;padding:clamp(30px,3.2vw,56px);background:#ffffffed;border:1px solid #e2e8eb;border-radius:26px;box-shadow:0 12px 28px #5b90aa14;position:relative;z-index:3}.entry-card h2{font-size:clamp(30px,2.9vw,46px);line-height:1.3;margin:5px 0 30px;letter-spacing:-1.5px}.roles{border:1px solid var(--line);border-radius:12px;padding:0;display:flex;margin:0 0 28px;background:#f8fafb;min-width:0}.roles label{flex:1;position:relative;cursor:pointer}.roles input{position:absolute;opacity:0;width:1px;height:1px}.roles span{height:66px;display:flex;align-items:center;justify-content:center;gap:12px;color:#7e8591;font-size:22px;border:1.5px solid transparent;border-radius:10px;margin:-1px}.roles input:checked+span{color:var(--teal);border-color:var(--teal);background:white}.roles input:focus-visible+span{outline:3px solid #48bfc6;outline-offset:3px}.roles svg{width:30px;height:30px}.field{margin-bottom:24px}.field label,.member-options>label{display:block;font-size:18px;margin-bottom:10px;color:#2f3948}.input-wrap{height:60px;border:1.5px solid var(--line);border-radius:11px;display:flex;align-items:center;gap:16px;padding:0 17px;background:#fff}.input-wrap:focus-within{border-color:var(--teal)}.input-wrap svg{color:#858d9a}.input-wrap input{min-width:0;width:100%;height:100%;border:0;background:transparent;font-size:17px;color:#33465b;outline:none}input::placeholder{color:#969eab}.join-button{width:100%;height:66px;display:flex;align-items:center;justify-content:center;gap:14px;border-radius:11px;font-size:21px;font-weight:700}.join-button{border:0;background:var(--teal);color:white;margin-top:26px}.join-button:hover{background:#008e95}.permissions-note{color:#858e9d;text-align:center;font-size:15px;line-height:1.5;margin:28px 0 0;white-space:normal}.member-options{margin:-2px 0 20px}.member-options input{width:100%;height:48px;border:1.5px solid var(--line);border-radius:10px;padding:0 14px;min-width:0}.member-options p{font-size:12px;line-height:1.5;color:#7a8896;margin-bottom:0}.member-options small{color:#89929d;font-size:12px}#entryStatus{font-size:13px;line-height:1.5;color:#426879;margin:12px 0 0;overflow-wrap:anywhere}#entryStatus:empty{display:none}#entryStatus.error{color:#b14444}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(min-width:1500px){.welcome{gap:40px}.hero-copy{padding-top:116px}.entry-card{padding-top:60px;padding-bottom:50px}.roles{margin-bottom:30px}.roles span{height:70px}.input-wrap{height:64px}.field{margin-bottom:28px}.join-button{height:70px}}
@media(max-width:1100px) and (min-width:781px){.welcome{grid-template-columns:minmax(0,1.1fr) minmax(360px,1fr);gap:20px;padding-right:3vw}.hero-copy{padding-left:10%;padding-top:110px}.hero h1{font-size:36px}.hero-copy p{font-size:18px}.hero{min-height:650px}.hero-dots{display:none}.illustration{height:48%;background-size:200% auto}.entry-card{padding:28px}.permissions-note{font-size:13px}}
@media(max-width:780px){.welcome{display:flex;flex-direction:column;gap:24px;padding:28px 20px 36px}.hero{min-height:0;align-self:auto;width:100%;border-radius:0;overflow:visible}.brand{position:static}.hero-copy{padding:28px 4px 0}.hero h1{font-size:34px;line-height:1.3;letter-spacing:-1.4px;margin-bottom:12px}.hero-copy p{font-size:16px;line-height:1.6}.illustration,.hero-dots{display:none}.entry-card{max-width:560px;padding:28px 24px;border-radius:20px}.entry-card h2{font-size:29px;margin:0 0 22px}.roles{margin-bottom:22px}.roles span{height:55px;font-size:18px}.field{margin-bottom:20px}.input-wrap{height:54px;gap:10px;padding:0 12px}.input-wrap input{font-size:15px}.field label{font-size:16px}.join-button{height:56px;font-size:18px}.permissions-note{font-size:12px;margin-top:23px}}
.device-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;border:0;padding:0;margin:0;min-width:0}
.device-options legend{padding:0;margin-bottom:10px;font-size:16px;color:#2f3948}
.device-options label{position:relative;min-width:0;cursor:pointer}
.device-options input{position:absolute;opacity:0;width:1px!important;height:1px!important}
.device-options label>span{display:flex;min-height:70px;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:8px 5px;border:1px solid var(--line);border-radius:10px;background:#fff;text-align:center;color:#5f7184}
.device-options strong{font-size:14px;line-height:1.3;font-weight:700}
.device-options small{font-size:11px;line-height:1.35;color:#7d8996}
.device-options input:checked+span{border-color:var(--teal);background:#edfafa;color:#008c93;box-shadow:inset 0 0 0 1px var(--teal)}
.device-options input:focus-visible+span{outline:3px solid #48bfc6;outline-offset:3px}
.member-options details{margin-top:12px;font-size:13px;color:#59737c}
.member-options summary{cursor:pointer;padding:5px 0}
.member-options details label{display:block;margin:10px 0 7px;font-size:13px}
.welcome.is-member .entry-card{padding:24px 32px}
.welcome.is-member .entry-card h2{font-size:32px;margin:0 0 18px}
.welcome.is-member .roles{margin-bottom:18px}
.welcome.is-member .roles span{height:52px;font-size:19px}
.welcome.is-member .field{margin-bottom:16px}
.welcome.is-member .field label{font-size:16px;margin-bottom:8px}
.welcome.is-member .input-wrap{height:52px}
.welcome.is-member .member-options{margin:0 0 16px}
.welcome.is-member .join-button{height:54px;font-size:19px}
.welcome.is-member .join-button{margin-top:16px}
.welcome.is-member .permissions-note{font-size:13px;margin-top:18px}
@media(max-width:480px){.welcome.is-member .entry-card{padding:24px}.device-options{grid-template-columns:1fr}.device-options label>span{min-height:48px;flex-direction:row;justify-content:space-between;gap:10px;padding:10px}.device-options small{font-size:11px}}

.device-note{font-size:12px;font-weight:400;line-height:1.6;display:inline-block}.field[hidden]{display:none!important}

.login-profile{border:0;padding:0;margin:0 0 18px;display:grid;grid-template-columns:1fr 1fr;gap:10px}.login-profile legend{font-weight:600;margin-bottom:10px}.login-profile label{font-size:13px;display:grid;gap:5px}.login-profile input,.login-profile select{width:100%;box-sizing:border-box;border:1px solid #ccd8cc;border-radius:7px;padding:9px;min-width:0;background:white;font:inherit}.welcome.is-member{min-height:100vh;height:auto}.welcome.is-member .entry-card{overflow:visible}@media(max-width:480px){.login-profile{grid-template-columns:1fr 1fr}}

body{user-select:none;-webkit-user-select:none}input,textarea,[contenteditable=true]{user-select:text;-webkit-user-select:text}img,video{-webkit-user-drag:none}
