@font-face{font-family:MR Brush;src:url(../ui/login/font-brush.woff2)format("woff2");font-display:swap}@font-face{font-family:MR Myeongjo;src:url(../ui/login/font-myeongjo-r.woff2)format("woff2");font-weight:400;font-display:swap}@font-face{font-family:MR Myeongjo;src:url(../ui/login/font-myeongjo-b.woff2)format("woff2");font-weight:700;font-display:swap}#login{--ink:#14120f;--w:700;--t-s:calc(var(--fs) - 1px);--t-m:calc(var(--fs) + 2px);--t-l:calc(var(--fs) + 7px);--ls-s:0;--ls-b:.12em;--ink-strong:#0b0a08;--t-f:calc(var(--fs) + 1px);--t-i:var(--fs);--t-h:calc(var(--fs) - 2px);--ink-2:#453f36;--paper:#f4eddc;--seal:#b3342a;--seal-d:#7c1c16;--f-serif:"MR Myeongjo", "Noto Serif KR", "Noto Serif CJK KR", "Nanum Myeongjo", "AppleMyungjo", "Batang", "Malgun Gothic", "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;--f-brush:"MR Brush", "Nanum Brush Script", "Noto Serif KR", "Batang", "Malgun Gothic", sans-serif;--card-w:330px;--pad-x:40px;--title-fs:112px;--title-h:156px;--sub-fs:14px;--sub-pad-y:3px;--fs:15px;--fld-h:46px;--gap-t:16px;--pad-t:32px;--pad-b:30px;--cx:0px}@media (min-aspect-ratio:3/2){#login{--cx:1vw}}@media (min-aspect-ratio:7/4){#login{--cx:1.7vw}}@media (max-width:1100px),(max-height:700px){#login{--card-w:308px;--pad-x:34px;--title-fs:88px;--title-h:124px;--sub-fs:13px;--fs:14px;--fld-h:42px;--gap-t:12px;--pad-t:28px;--pad-b:28px}}@media (max-width:860px),(max-height:640px){#login{--card-w:284px;--pad-x:30px;--title-fs:78px;--title-h:108px;--pad-t:26px;--pad-b:26px;--fld-h:40px;--cx:-1vw}#login button{letter-spacing:.16em;text-indent:.16em;padding:0 6px}#login button[value=register]{letter-spacing:.04em;text-indent:.04em}}@media (min-width:1400px) and (min-height:850px){#login{--card-w:430px;--pad-x:50px;--title-fs:144px;--title-h:200px;--sub-fs:17px;--fs:18px;--fld-h:54px;--gap-t:20px;--pad-t:38px;--pad-b:36px}}@media (min-width:1800px) and (min-height:1000px){#login{--card-w:470px;--pad-x:54px;--title-fs:164px;--title-h:224px;--sub-fs:18px;--fs:19px;--fld-h:58px;--gap-t:22px;--pad-t:42px;--pad-b:40px}}#login{box-sizing:border-box;padding:0 max(0px, calc(var(--cx) * -2)) calc(var(--fs) * 7.4) max(0px, calc(var(--cx) * 2));color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;justify-content:safe center;align-items:safe center;display:flex;position:absolute;inset:0;overflow:hidden auto}#login[hidden]{display:none}#login:after{content:"";z-index:0;pointer-events:none;background:radial-gradient(30% 46% at 48.5% 55%,#f6f0e080,#0000 74%);position:absolute;inset:0}#login-form,#login .modal-card{z-index:3;isolation:isolate;box-sizing:border-box;width:var(--card-w);padding:0 var(--pad-x) var(--pad-b);font:var(--w) var(--t-s)/1.5 var(--f-serif);color:var(--ink);flex-direction:column;margin:0;display:flex;position:relative}#login-form:before,#login .modal-card:before{content:"";z-index:-1;pointer-events:none;inset:calc(var(--title-h) + var(--gap-t)) 0 0 0;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:linear-gradient(#faf5e7e6,#f3ebd7e0);border:1px solid #1c1a174d;border-radius:8px;animation:.4s cubic-bezier(.22,.8,.2,1) 40ms both panel-in;position:absolute;box-shadow:0 16px 36px #1c1a1733,0 2px 6px #1c1a171f,inset 0 1px #ffffffbf,inset 0 0 0 1px #fffdf473}@keyframes panel-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}#login .title{height:var(--title-h);margin-bottom:calc(var(--gap-t) + var(--pad-t));font:400 var(--title-fs)/.86 var(--f-brush);letter-spacing:.01em;text-align:center;color:var(--ink);text-shadow:0 0 .1em #f7f2e4f2,0 0 .26em #f7f2e4d9,0 0 .55em #f7f2e499,0 .012em .03em #1c1a178c;flex-direction:column;order:0;justify-content:flex-end;align-items:center;animation:.5s cubic-bezier(.2,.7,.2,1) both ink-in;display:flex}#login .title:after{content:"강호로 드는 문";margin-top:calc(var(--title-fs) * .12);padding:var(--sub-pad-y) 14px var(--sub-pad-y) calc(14px + .5em);font:var(--w) var(--sub-fs)/1.3 var(--f-serif);letter-spacing:.5em;color:var(--ink);text-shadow:none;background:#f7f1e2f0;border-top:1px solid #1c1a178c;border-bottom:1px solid #1c1a178c;animation:.4s ease-out .12s both fade-up}@keyframes ink-in{0%{opacity:0;filter:blur(9px);transform:scale(1.07)}to{opacity:1;filter:blur();transform:none}}@keyframes fade-up{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}#login-form:after{content:"무\a 림";white-space:pre;text-align:center;z-index:2;pointer-events:none;left:calc(50% + var(--title-fs) * .6 + 8px);top:calc(var(--title-h) - var(--sub-fs) * 1.3 - var(--sub-pad-y) * 2 - 2px - var(--title-fs) * .12 - var(--title-fs) * .5 - 6px);box-sizing:border-box;width:calc(var(--title-fs) * .34);height:calc(var(--title-fs) * .44);font:700 calc(var(--title-fs) * .165)/1.02 var(--f-serif);color:#f6efdd;background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='90' height='110'><filter id='s' x='0' y='0' width='1' height='1'><feTurbulence type='fractalNoise' baseFrequency='.55' numOctaves='2' seed='6'/><feColorMatrix values='0 0 0 0 .96 0 0 0 0 .92 0 0 0 0 .85 0 0 0 9 -5.7'/></filter><rect width='90' height='110' filter='url(%23s)'/></svg>") 0 0 / 100% 100%, linear-gradient(160deg, #c5402f, var(--seal) 55%, #9c2b22);box-shadow:inset 0 0 0 calc(var(--title-fs) * .018) #f6efdd00, inset 0 0 0 calc(var(--title-fs) * .012) #f6efddb8;clip-path:polygon(1% 3%,22% 0,48% 2%,76% 0,99% 2%,100% 26%,98% 52%,100% 78%,99% 98%,74% 100%,50% 98%,24% 100%,2% 99%,0 74%,2% 50%,0 24%);transform-origin:50%;justify-content:center;align-items:center;animation:.18s cubic-bezier(.3,1.5,.5,1) .4s both stamp;display:flex;position:absolute;transform:rotate(-5deg)}@keyframes stamp{0%{opacity:0;transform:rotate(-12deg)scale(1.7)}to{opacity:.96;transform:rotate(-5deg)scale(1)}}#login label{font:var(--w) var(--t-f)/1.2 var(--f-serif);letter-spacing:.06em;color:var(--ink-strong);gap:8px;margin:0 0 18px;animation:.3s ease-out both fade-up;display:grid;position:relative}#login label:first-of-type{animation-delay:.16s}#login label:nth-of-type(2){animation-delay:.22s}#login label:first-of-type:after{content:"영문 · 숫자";right:0;top:calc((var(--t-f) - var(--t-h)) * .7);font:var(--w) var(--t-h)/1.2 var(--f-serif);letter-spacing:var(--ls-s);color:var(--ink-2);position:absolute}#login label:before{content:"";left:0;top:calc(var(--t-f) * 1.2 + 1px);background:linear-gradient(90deg, var(--seal), #b3342a00);transform-origin:0;border-radius:2px;width:34px;height:2px;transition:transform .22s cubic-bezier(.2,.8,.2,1);position:absolute;transform:scaleX(0)}#login label:focus-within:before{transform:scaleX(1)}#login label:focus-within{color:var(--seal-d)}#login input{box-sizing:border-box;width:100%;height:var(--fld-h);font:var(--w) var(--t-i)/1 var(--f-serif);letter-spacing:0;color:var(--ink);caret-color:var(--ink);background:#fffef8c7;border:1px solid #1c1a178c;border-radius:4px;outline:0;margin:0;padding:0 14px;transition:background-color .18s,border-color .18s,box-shadow .18s;box-shadow:inset 0 1px 3px #46361e24}#login input[type=password]{letter-spacing:.2em}#login input:hover{background:#fffffbe6;border-color:#1c1a17bf}#login input:focus,#login input:focus-visible{border-color:var(--ink);outline:2px solid var(--seal);outline-offset:2px;background:#fffffbf0;box-shadow:inset 0 2px 5px #46361e1f,0 0 0 5px #b3342a1a}#login input:disabled{color:#5f5749;background:#1c1a1714;border-style:dashed}#login input::selection{background:#b3342a47}#login .latin-caret{background:var(--ink);pointer-events:none;width:2px;animation:1.06s step-end infinite caret;position:absolute}#login .latin-caret[hidden]{display:none}@keyframes caret{0%,55%{opacity:1}56%,to{opacity:0}}#login .row{flex-wrap:wrap;gap:10px;margin-top:4px;animation:.3s ease-out .28s both fade-up;display:flex}#login button{box-sizing:border-box;min-height:calc(var(--fld-h) + 2px);font:var(--w) var(--t-m)/1 var(--f-serif);letter-spacing:var(--ls-b);text-indent:var(--ls-b);white-space:nowrap;cursor:pointer;border-radius:4px;flex:80px;justify-content:center;align-items:center;margin:0;padding:0 10px;transition:background-color .16s,color .16s,box-shadow .16s,transform 80ms;display:inline-flex}#login button[hidden]{display:none}#login button[type=submit]{color:#f6f0e0;background:linear-gradient(#38342d,#25221d);border:1px solid #14120f;box-shadow:0 1px 2px #1c1a174d,inset 0 1px #ffffff1a}#login button[value=register]{letter-spacing:var(--ls-b);text-indent:var(--ls-b);font-size:var(--t-s);color:var(--ink);box-shadow:none;background:#fffdf473;border:1px solid #1c1a17b3;flex:1.55 128px}#login button:hover:not(:disabled){box-shadow:inset 0 -4px 0 var(--seal), 0 2px 0 #1c1a1740}#login button[type=submit]:hover:not(:disabled){background:linear-gradient(#45403a,#2d2a24)}#login button[value=register]:hover:not(:disabled){background:#fffdf4b8}#login button:active:not(:disabled){box-shadow:inset 0 -2px 0 var(--seal);transform:translateY(1px)}#login button[type=submit]:active:not(:disabled){background:#1a1815}#login button:focus-visible{outline:2px solid var(--seal);outline-offset:3px}#login button:disabled{cursor:progress;box-shadow:none;color:#5a5245;background:#1c1a171a;border:1px dashed #1c1a1780;transform:none}#login .msg{box-sizing:border-box;min-height:calc(var(--fs) * 1.55 + 18px);font:var(--w) var(--t-s)/1.55 var(--f-serif);letter-spacing:var(--ls-s);color:var(--seal-d);white-space:pre-wrap;overflow-wrap:anywhere;word-break:keep-all;margin:14px 0 0}#login .msg:not(:empty){border-left:3px solid var(--seal);background:linear-gradient(90deg,#b3342a1c,#b3342a0a),#fbf6eadb;border-radius:1px 4px 4px 1px;padding:8px 12px 9px 13px;animation:.45s ease-out both bleed;box-shadow:0 1px #1c1a171a}@keyframes bleed{0%{opacity:0;filter:blur(3px);transform:translateY(-3px)}to{opacity:1;filter:blur();transform:none}}@media (prefers-reduced-motion:reduce){#login,#login *,#login:before,#login:after,#login :before,#login :after{transition:none!important;animation:none!important}#login .latin-caret{opacity:1;animation:none!important}}#stage{z-index:0;background:#d8d3c4 url(../ui/login/login-poster.webp) 60% 46%/cover no-repeat;position:absolute;inset:0;overflow:hidden}#stage[hidden]{display:none}#stage video{object-fit:cover;object-position:60% 46%;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}#stage:after{content:"";pointer-events:none;background:radial-gradient(120% 100% at 50% 46%,#0000 62%,#1c1a1729 100%);position:absolute;inset:0}#login,#lobby{z-index:2;background:0 0}#login .row.sub{gap:8px;margin-top:12px}#login button.ghost{min-height:calc(var(--fld-h) - 8px);font-size:var(--t-s);letter-spacing:var(--ls-b);text-indent:var(--ls-b);color:var(--ink);background:#fffdf44d;border:1px solid #1c1a179e;flex:1 1 0}#login button.ghost:hover:not(:disabled){background:#fffdf4b3}#login button.link{min-height:0;letter-spacing:var(--ls-s);text-indent:0;font:var(--w) var(--t-s)/1.4 var(--f-serif);color:var(--seal-d);text-underline-offset:3px;box-shadow:none;background:0 0;border:0;border-radius:0;flex:none;padding:2px 4px;text-decoration:underline}#login button.link:hover:not(:disabled){box-shadow:none;color:var(--seal)}#login .login-notice{z-index:4;box-sizing:border-box;width:min(max(880px,62vw),100% - 28px);font:var(--w) var(--t-s)/1.6 var(--f-serif);color:var(--ink);text-align:center;word-break:keep-all;background:#f7f1e2f5;border-top:1px solid #1c1a1799;border-bottom:1px solid #1c1a1799;margin:0 auto;padding:8px 16px 9px;animation:.5s ease-out .5s both fade-up;position:fixed;bottom:max(10px,1.6vh);left:0;right:0;box-shadow:0 6px 16px #1c1a1738}#login .login-notice button.link{font-size:inherit;margin-left:4px;padding:0 2px;display:inline}#login,#lobby{--snd:40px}@media (min-width:1400px) and (min-height:850px){#login,#lobby{--snd:46px}}@media (min-width:1800px) and (min-height:1000px){#login,#lobby{--snd:52px}}#login .sound,#lobby .sound{z-index:5;box-sizing:border-box;width:var(--snd);height:var(--snd);min-width:var(--snd);min-height:var(--snd);max-width:var(--snd);max-height:var(--snd);aspect-ratio:1;letter-spacing:0;text-indent:0;font:700 calc(var(--snd) * .5)/1 var(--f-serif);color:var(--ink);cursor:pointer;background:#f4eddcdb;border:1px solid #1c1a17b3;border-radius:50%;flex:none;justify-content:center;align-items:center;margin:0;padding:0;transition:background-color .15s,transform 80ms;display:inline-flex;position:absolute;top:14px;right:16px;box-shadow:0 3px 8px #1c1a1740}#login .sound:hover,#lobby .sound:hover{background:#fffdf4fa}#login .sound:focus-visible,#lobby .sound:focus-visible{outline:2px solid var(--seal);outline-offset:3px}#login .sound[aria-pressed=true],#lobby .sound[aria-pressed=true]{color:#6b6357}#login .sound[aria-pressed=true]:after,#lobby .sound[aria-pressed=true]:after{content:"";width:calc(var(--snd) * .65);background:var(--seal);height:2px;position:absolute;transform:rotate(-42deg)}#login .modal-host{z-index:20;background:#1c1a1785;justify-content:center;align-items:safe center;padding:18px 0;animation:.2s ease-out both veil;display:flex;position:absolute;inset:0;overflow-y:auto}#login .modal-host[hidden]{display:none}@keyframes veil{0%{opacity:0}to{opacity:1}}#login .modal-card{--title-h:0px;--gap-t:0px;--pad-t:30px;--pad-b:28px;width:min(var(--card-w) + 44px, calc(100% - 28px));font-size:var(--t-s);margin:auto}#login .modal-card.wide{width:min(560px,100% - 28px)}#login .modal-card[hidden]{display:none}#login .modal-card h2{margin:var(--pad-t) 0 18px;text-align:center;font:var(--w) var(--t-l)/1.2 var(--f-serif);letter-spacing:.32em;text-indent:.32em;color:var(--ink)}#login .modal-card .lead{text-align:center;font:var(--w) var(--t-s)/1.5 var(--f-serif);color:var(--ink);margin:-6px 0 16px}#login .modal-card .agree{letter-spacing:0;font:var(--w) var(--t-s)/1.5 var(--f-serif);color:var(--ink);align-items:flex-start;gap:10px;margin:2px 0 14px;animation:none;display:flex}#login .modal-card .agree:before{display:none}#login .modal-card .agree label{letter-spacing:0;font:inherit;color:inherit;cursor:pointer;margin:0;padding:0;animation:none;display:inline}#login .modal-card .agree label:before,#login .modal-card .agree label:after{content:none;display:none}#login .modal-card .agree input{width:20px;height:20px;accent-color:var(--seal);flex:none;margin:1px 0 0;padding:0}#login .modal-card .notice-body{font:var(--w) var(--t-s)/1.7 var(--f-serif);color:var(--ink);word-break:keep-all;margin:0 0 6px;padding:0 0 0 1.4em}#login .modal-card .notice-body li{margin:0 0 9px}#login .modal-card .notice-body b{font-weight:var(--w);color:var(--seal-d)}#login .modal-card .msg{min-height:calc(var(--fs) * 1.55 + 18px);margin-top:6px}#login .modal-card .row{margin-top:2px}#login .modal-card button.cancel{flex:.8 1 0}#login:has(.modal-host:not([hidden])) #login-form{visibility:hidden}#lobby{--ink:#14120f;--ink-2:#453f36;--seal:#b3342a;--seal-d:#7c1c16;--notice:#2f5d9a;--notice-d:#173c6e;--w:700;--t-s:calc(var(--fs) - 1px);--t-m:calc(var(--fs) + 2px);--t-l:calc(var(--fs) + 7px);--ls-s:0;--ls-b:.12em;--f-serif:"MR Myeongjo", "Noto Serif KR", "Noto Serif CJK KR", "Nanum Myeongjo", "AppleMyungjo", "Batang", "Malgun Gothic", "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;--f-brush:"MR Brush", "Nanum Brush Script", "Noto Serif KR", "Batang", "Malgun Gothic", sans-serif;--card-w:420px;--pad-x:38px;--pad-t:30px;--pad-b:30px;--fs:15px;--title-h:0px;--gap-t:0px;box-sizing:border-box;color:var(--ink);-webkit-font-smoothing:antialiased;justify-content:center;align-items:safe center;padding:14px 0 2vh;display:flex;position:absolute;inset:0;overflow-y:auto}@media (min-width:1400px) and (min-height:850px){#lobby{--card-w:500px;--pad-x:46px;--pad-t:36px;--pad-b:36px;--fs:17px}}@media (max-width:860px),(max-height:640px){#lobby{--card-w:336px;--pad-x:28px;--pad-t:26px;--pad-b:28px;--fs:14px}}#lobby[hidden]{display:none}#lobby .panel{z-index:3;isolation:isolate;box-sizing:border-box;width:var(--card-w);min-width:0;padding:0 var(--pad-x) var(--pad-b);font:700 var(--fs)/1.5 var(--f-serif);color:var(--ink);background:0 0;border:0;flex-direction:column;gap:0;margin:auto;display:flex;position:relative}#lobby .panel:before{content:"";z-index:-1;pointer-events:none;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:linear-gradient(#faf5e7e6,#f3ebd7e0);border:1px solid #1c1a174d;border-radius:8px;animation:.4s cubic-bezier(.22,.8,.2,1) 40ms both panel-in;position:absolute;inset:0;box-shadow:0 16px 36px #1c1a1733,0 2px 6px #1c1a171f,inset 0 1px #ffffffbf,inset 0 0 0 1px #fffdf473}#lobby .title{margin:var(--pad-t) 0 22px;text-align:center;font:var(--w) var(--t-l)/1.2 var(--f-serif);letter-spacing:.32em;text-indent:.32em;color:var(--ink);text-shadow:0 0 .3em #f7f2e4e6;animation:.5s cubic-bezier(.2,.7,.2,1) both ink-in}#lobby .slot{box-sizing:border-box;background:#fffef8b3;border:1px solid #1c1a1780;border-radius:4px;align-items:center;gap:10px;min-height:52px;margin:0 0 10px;padding:9px 12px;animation:.3s ease-out both fade-up;display:flex;box-shadow:inset 0 1px 3px #46361e1f}#lobby .slot:nth-of-type(2){animation-delay:60ms}#lobby .slot:nth-of-type(3){animation-delay:.1s}#lobby .slot:nth-of-type(4){animation-delay:.14s}#lobby .slot:nth-of-type(5){animation-delay:.18s}#lobby .slot:nth-of-type(6){animation-delay:.22s}#lobby .slot .who{flex:1;min-width:0}#lobby .slot .who .name{font:var(--w) var(--t-m)/1.3 var(--f-serif);color:var(--ink);overflow-wrap:anywhere}#lobby .slot .who .sub{font:var(--w) var(--t-s)/1.4 var(--f-serif);color:var(--ink)}#lobby .slot.empty{background:#fffdf438;border-style:dashed}#lobby .slot.empty .who{font:var(--w) var(--t-s)/1.4 var(--f-serif);color:var(--ink)}#lobby input{box-sizing:border-box;min-width:0;height:38px;font:var(--w) var(--t-m)/1 var(--f-serif);color:var(--ink);background:#fffef8d9;border:1px solid #1c1a178c;border-radius:4px;outline:0;flex:1;padding:0 10px;box-shadow:inset 0 1px 3px #46361e24}#lobby input:focus,#lobby input:focus-visible{border-color:var(--ink);outline:2px solid var(--seal);outline-offset:2px}#lobby button{min-height:38px;font:var(--w) var(--t-s)/1 var(--f-serif);letter-spacing:var(--ls-b);text-indent:var(--ls-b);white-space:nowrap;cursor:pointer;color:#f6f0e0;background:linear-gradient(#38342d,#25221d);border:1px solid #14120f;border-radius:4px;flex:none;padding:0 14px;transition:background-color .16s,box-shadow .16s,transform 80ms;box-shadow:0 1px 2px #1c1a174d,inset 0 1px #ffffff1a}#lobby button.ghost{color:var(--ink);box-shadow:none;background:#fffdf461;border:1px solid #1c1a17b3}#lobby button:hover:not(:disabled){box-shadow:inset 0 -4px 0 var(--seal), 0 2px 0 #1c1a1740}#lobby button:active:not(:disabled){transform:translateY(1px)}#lobby button:focus-visible{outline:2px solid var(--seal);outline-offset:3px}#lobby .note{text-align:center;font:var(--w) var(--t-s)/1.5 var(--f-serif);color:var(--ink);overflow-wrap:anywhere;word-break:keep-all;margin:2px 0 10px}#lobby .foot{justify-content:center;margin:4px 0 2px;display:flex}#lobby button.logout{min-width:168px}#lobby .msg{box-sizing:border-box;min-height:calc(var(--fs) * 1.55 + 4px);text-align:center;font:var(--w) var(--t-s)/1.55 var(--f-serif);color:var(--seal-d);white-space:pre-wrap;overflow-wrap:anywhere;word-break:keep-all;margin:8px 0 0}#lobby .msg:not(:empty){border-left:3px solid var(--seal);background:linear-gradient(90deg,#b3342a1c,#b3342a0a),#fbf6eadb;border-radius:1px 4px 4px 1px;padding:7px 12px 8px;animation:.45s ease-out both bleed}#lobby .msg.notice{color:var(--notice-d)}#lobby .msg.notice:not(:empty){border-left-color:var(--notice);background:linear-gradient(90deg,#2f5d9a21,#2f5d9a0d),#fbf6eadb}@media (prefers-reduced-motion:reduce){#lobby,#lobby *,#lobby :before{transition:none!important;animation:none!important}}