@font-face{font-family:NotoKR;src:url("/assets/fonts/NotoSansKR-VF.ttf") format("truetype");font-display:swap}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{font-family:NotoKR,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#fff;background:#0a0e27}
.login-page{position:relative;display:flex;min-height:100%;align-items:center;justify-content:center;padding:24px;overflow:hidden;background:linear-gradient(165deg,#0a0e27 0%,#131a3a 46%,#1a2147 76%,#0d1230 100%)}
.login-page::after{content:"";position:absolute;inset:auto -10% -18% -10%;height:45%;background:radial-gradient(ellipse at center,rgba(56,189,248,.2),transparent 68%);filter:blur(28px);pointer-events:none}
.stars{position:absolute;inset:0;width:2px;height:2px;border-radius:50%;animation:twinkle 4.8s ease-in-out infinite;opacity:.75}
.stars-sm{box-shadow:8vw 12vh 0 1px rgba(255,255,255,.75),18vw 72vh 0 1px rgba(255,255,255,.62),28vw 24vh 0 1px rgba(255,255,255,.78),42vw 82vh 0 1px rgba(255,255,255,.55),56vw 16vh 0 1px rgba(255,255,255,.75),72vw 68vh 0 1px rgba(255,255,255,.68),86vw 22vh 0 1px rgba(255,255,255,.7),94vw 76vh 0 1px rgba(255,255,255,.58)}
.stars-md{animation-delay:.8s;box-shadow:12vw 38vh 0 1.6px rgba(186,230,253,.72),34vw 9vh 0 1.6px rgba(255,255,255,.7),62vw 42vh 0 1.6px rgba(186,230,253,.68),78vw 88vh 0 1.6px rgba(255,255,255,.72),90vw 48vh 0 1.6px rgba(186,230,253,.68)}
.stars-lg{animation-delay:1.7s;box-shadow:20vw 18vh 0 2.2px rgba(255,255,255,.82),50vw 88vh 0 2.2px rgba(125,211,252,.72),82vw 12vh 0 2.2px rgba(255,255,255,.78)}
.milky-way{position:absolute;width:140%;height:160px;left:-20%;top:22%;transform:rotate(-14deg);background:linear-gradient(90deg,transparent,rgba(125,211,252,.05),rgba(255,255,255,.11),rgba(129,140,248,.06),transparent);filter:blur(10px);opacity:.75}
.shooting-star{position:absolute;width:120px;height:2px;border-radius:999px;background:linear-gradient(90deg,rgba(255,255,255,.95),transparent);filter:drop-shadow(0 0 8px rgba(125,211,252,.8));transform:rotate(-24deg);animation:shoot 8s linear infinite;opacity:0}
.ss1{top:16%;left:18%}.ss2{top:34%;left:68%;animation-delay:2.8s}.ss3{top:62%;left:32%;animation-delay:5.2s}
.is-loading .shooting-star{animation-duration:3s}
.login-stack{position:relative;z-index:1;width:min(100%,448px);animation:panel-in .45s ease both}
.login-arc{position:absolute;top:-32px;left:50%;width:280px;max-width:88vw;height:90px;transform:translateX(-50%);pointer-events:none;overflow:visible}
.login-arc-comet{position:absolute;top:0;left:0;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:50%;background:#fff;box-shadow:0 0 8px 3px rgba(186,230,253,.95),0 0 18px 7px rgba(129,140,248,.55);offset-path:path("M10,80 Q140,-6 270,80");-webkit-offset-path:path("M10,80 Q140,-6 270,80");offset-rotate:0deg;opacity:0;animation:comet-arc 6.5s cubic-bezier(.33,0,.67,1) infinite;animation-delay:1.1s}
.brand-mark{display:grid;width:64px;height:64px;margin:0 auto 16px;place-items:center;border-radius:17px;background:linear-gradient(135deg,#38bdf8,#6366f1);box-shadow:0 16px 34px rgba(56,189,248,.34);animation:logo-pop .64s cubic-bezier(.34,1.56,.64,1) both}
.brand-mark svg{width:48px;height:48px;fill:none;stroke:#3f3f46;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.brand-mark .palette-body{fill:#f0d59d}.brand-mark .paint-green{fill:#6ee338}.brand-mark .paint-yellow{fill:#ffec2f}.brand-mark .paint-orange{fill:#ff911f}.brand-mark .paint-red{fill:#ff5a43}.brand-mark .paint-white{fill:#f8fafc}.brand-mark .brush-handle{fill:#38c6f4}.brand-mark .brush-ferrule{fill:#dff7ff}.brand-mark .brush-tip{fill:#fff2d8}
h1{margin:0;text-align:center;font-size:24px;line-height:1.25;font-weight:900}
.login-guide{margin:12px auto 30px;max-width:360px;text-align:center;color:#b7c4d8;font-size:14px;font-weight:650;line-height:1.55}
.login-example{display:block;margin-top:10px;color:#7dd3fc;font-size:13px;font-weight:600}
.login-card{padding:34px 32px 32px;border:1px solid rgba(148,163,184,.28);border-radius:14px;background:rgba(48,56,91,.86);box-shadow:0 22px 68px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.06);backdrop-filter:blur(18px)}
.login-form{display:grid;gap:15px}
.login-form h2{margin:0 0 12px;font-size:20px;line-height:1.2}
.login-form label:not(.remember-row){display:grid;gap:8px;color:#d6deeb;font-size:14px;font-weight:750}
.login-form input[type="text"],.login-form input[type="password"]{width:100%;height:46px;border:1px solid rgba(148,163,184,.38);border-radius:12px;padding:0 15px;background:rgba(49,58,94,.72);color:#fff;font:inherit;outline:none;transition:border-color .18s,box-shadow .18s,background .18s}
.login-form input:focus{border-color:#38bdf8;box-shadow:0 0 0 4px rgba(56,189,248,.14);background:rgba(2,6,23,.58)}
.remember-row{display:flex;align-items:center;gap:9px;width:max-content;color:#b7c4d8;font-size:14px;cursor:pointer;user-select:none}
.remember-row input{width:17px;height:17px;accent-color:#38bdf8}
.login-message{min-height:22px;margin:0;padding:0;font-size:13px;color:#fda4af}
.login-message:empty{display:block}
.login-button{position:relative;height:44px;border:0;border-radius:12px;background:#1eaee8;color:#fff;font:inherit;font-weight:850;cursor:pointer;box-shadow:none;overflow:hidden}
.login-button::after{content:"";position:absolute;inset:0;translate:-120% 0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:translate .45s}
.login-button:hover::after,.login-button:focus-visible::after,.login-button:disabled::after{translate:120% 0}
.login-button:disabled{cursor:wait;opacity:.78}
.success-dialog[hidden]{display:none}
.success-dialog{position:fixed;z-index:5;inset:0;display:grid;place-items:center;background:rgba(2,6,23,.62)}
.success-card{display:grid;gap:12px;justify-items:center;width:min(360px,calc(100vw - 48px));padding:30px;border:1px solid rgba(148,163,184,.25);border-radius:22px;background:rgba(15,23,42,.9);box-shadow:0 28px 70px rgba(0,0,0,.42);animation:success-in .22s ease both}
.success-icon{display:grid;width:58px;height:58px;place-items:center;border-radius:50%;background:rgba(52,211,153,.16);color:#6ee7b7}
.success-icon svg{width:32px;height:32px;fill:none;stroke:currentColor;stroke-width:2.7;stroke-linecap:round;stroke-linejoin:round}
.success-card strong{font-size:18px}.success-card small{color:#94a3b8}
@keyframes twinkle{0%,100%{opacity:.45;transform:scale(.96)}50%{opacity:1;transform:scale(1.08)}}
@keyframes shoot{0%,72%{opacity:0;transform:translate3d(0,0,0) rotate(-24deg)}74%{opacity:1}100%{opacity:0;transform:translate3d(360px,150px,0) rotate(-24deg)}}
@keyframes panel-in{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
@keyframes comet-arc{0%{offset-distance:0%;opacity:0}3%{opacity:1}48%{offset-distance:100%;opacity:1}55%,100%{offset-distance:100%;opacity:0}}
@keyframes logo-pop{0%{opacity:0;transform:scale(.6) rotate(-4deg)}60%{opacity:1;transform:scale(1.08) rotate(2deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes success-in{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:none}}
@media (max-width:520px){.login-page{padding:18px}.login-card{padding:28px 22px;border-radius:14px}h1{font-size:23px}.brand-mark{width:58px;height:58px}.brand-mark svg{width:44px;height:44px}}

.login-terms-notice{margin:2px 0 0;color:#c5d1e3;font-size:12px;line-height:1.8;overflow-wrap:anywhere}
#login-terms-open{display:inline;padding:0;border:0;background:transparent;color:#a5e4ff;font:inherit;font-weight:750;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
#login-terms-open:focus-visible{outline:2px solid #7dd3fc;outline-offset:3px;border-radius:2px}
.login-terms-dialog{width:min(760px,calc(100vw - 32px));max-height:calc(100dvh - 40px);padding:0;border:1px solid #d6dfec;border-radius:18px;color:#24344b;background:#fff;box-shadow:0 28px 80px #02061766;overflow:hidden}
.login-terms-dialog[open]{display:flex;flex-direction:column}
.login-terms-dialog::backdrop{background:#020617b3;backdrop-filter:blur(4px)}
.terms-head{flex:none;padding:23px 28px 19px;border-bottom:1px solid #e2e8f0}
.terms-head h2{margin:0;font-size:21px;line-height:1.5}
.terms-body{min-height:0;overflow:auto;overscroll-behavior:contain;padding:8px 28px 24px;font-size:14px;line-height:1.9;overflow-wrap:anywhere}
.terms-body section+section{margin-top:26px}.terms-body h3{margin:16px 0 8px;font-size:16px;color:#17375e}.terms-body p{margin:0}.terms-body ol{margin:0;padding-left:23px}.terms-body li+li{margin-top:7px}.terms-body a{color:#1454a8}.terms-company{border-top:1px solid #e2e8f0;padding-top:4px}
.terms-footer{display:flex;flex:none;justify-content:flex-end;padding:15px 28px;border-top:1px solid #e2e8f0;background:#f8fafc}
.terms-footer button{min-width:76px;border:1px solid #2462cf;border-radius:8px;padding:10px 18px;background:#2462cf;color:#fff;font:inherit;font-size:14px;cursor:pointer}.terms-footer button:focus-visible{outline:3px solid #7dd3fc;outline-offset:2px}
@media(max-width:520px){.terms-head{padding:18px 20px 14px}.terms-head h2{font-size:18px}.terms-body{padding:8px 20px 20px;font-size:13px}.terms-footer{padding:12px 20px}}
