:root{--ink:#1c1b2e;--paper:#fff7ea;--card:#fffdf8;--mut:#6b6577;--red:#ff4b3e;--yellow:#ffd43b;--blue:#5b8cff;--green:#3ddc97;--purple:#9d7bff;--pink:#ff8fb1;--line:3px solid var(--ink);--sh:5px 5px 0 var(--ink);--sh-sm:3px 3px 0 var(--ink);--disp:"Black Han Sans","Pretendard Variable",sans-serif;--body:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR",sans-serif;--serif:"Nanum Myeongjo","AppleMyungjo",serif;--type:#ff7a9a}*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0}#root{overflow-x:clip}body{background:var(--paper);color:var(--ink);font:16px/1.6 var(--body);-webkit-font-smoothing:antialiased;background-image:radial-gradient(#1c1b2e17 1.2px,#0000 1.3px);background-size:18px 18px}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.55}button:focus-visible,summary:focus-visible,.logo a:focus-visible{outline:3px solid var(--blue);outline-offset:2px}img{max-width:100%;display:block}.wrap{max-width:480px;margin:0 auto;padding:0 16px}.screen{padding-bottom:40px;display:none}.screen.on{animation:.35s ease-out rise;display:block}@keyframes rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.box{background:var(--card);border:var(--line);box-shadow:var(--sh);border-radius:18px}.btn{border:var(--line);width:100%;box-shadow:var(--sh);background:var(--yellow);font:22px/1 var(--disp);border-radius:16px;justify-content:center;align-items:center;gap:8px;padding:18px 16px;transition:transform 80ms,box-shadow 80ms;display:flex}.btn:active{box-shadow:1px 1px 0 var(--ink);transform:translate(4px,4px)}.btn.red{background:var(--red);color:#fff}.btn.white{background:#fff}.btn.ink{background:var(--ink);color:#fff}.btn.sm{box-shadow:var(--sh-sm);border-radius:13px;padding:13px 12px;font-size:17px}.chip{border:2px solid var(--ink);background:#fff;border-radius:999px;align-items:center;gap:4px;padding:3px 10px;font-size:13px;font-weight:700;display:inline-flex}h2.sec{font:24px/1.25 var(--disp);align-items:center;gap:8px;margin:34px 0 12px;display:flex}h2.sec small{font:600 13px var(--body);color:var(--mut)}.mut{color:var(--mut)}.logo{justify-content:space-between;align-items:center;padding:18px 0 4px;display:flex}.logo a{color:inherit;text-decoration:none}.logo b{font:30px/1 var(--disp);letter-spacing:-.5px}.logo b span{color:var(--red)}.sticker{font:15px/1 var(--disp);background:var(--red);color:#fff;border:var(--line);box-shadow:var(--sh-sm);border-radius:999px;padding:7px 12px;transform:rotate(6deg)}.hero-title{font:46px/1.12 var(--disp);letter-spacing:-1px;white-space:nowrap;margin:22px 0 10px;font-size:clamp(28px,9.1vw,46px)}.hero-title em{background:var(--yellow);border:var(--line);box-shadow:var(--sh-sm);border-radius:10px;padding:0 6px;font-style:normal;display:inline-block;transform:rotate(-2deg)}.hero-sub{margin:0 0 18px;font-size:16.5px}.hero-img{margin:6px 2px 26px;overflow:hidden;transform:rotate(-1.2deg)}.hero-img img{aspect-ratio:3/2;object-fit:cover;width:100%;height:auto}.meta-row{flex-wrap:wrap;justify-content:center;gap:8px;margin:14px 0 0;display:flex}.marquee{border-top:var(--line);border-bottom:var(--line);background:#fff;margin:26px -16px 0;padding:6px 0;overflow:hidden}.marquee-track{gap:10px;width:max-content;animation:38s linear infinite slide;display:flex}.marquee-track img{border:2px solid var(--ink);object-fit:cover;border-radius:14px;width:76px;height:76px}@keyframes slide{to{transform:translate(-50%)}}.namecheck{margin-top:22px;padding:16px}.namecheck p{margin:0 0 10px;font-weight:700}.row{gap:8px;display:flex}.inp{border:var(--line);min-width:0;font:600 16px var(--body);background:#fff;border-radius:12px;flex:1;padding:12px}.inp:focus{outline:3px solid var(--yellow);outline-offset:1px}.inp:disabled{opacity:.55;cursor:default}.qtop{align-items:center;gap:10px;padding:18px 0 8px;display:flex}.qback{border:var(--line);width:44px;height:44px;font:20px/1 var(--disp);box-shadow:var(--sh-sm);background:#fff;border-radius:12px;flex:none}.prog{border:var(--line);background:#fff;border-radius:999px;flex:1;height:18px;position:relative;overflow:hidden}.prog i{background:var(--red);border-right:var(--line);transition:width .3s;position:absolute;inset:0 auto 0 0}.qnum{font:18px var(--disp);text-align:right;min-width:52px}.qcard{text-align:center;margin-top:14px;padding:26px 20px 22px}.qemoji{margin-bottom:12px;font-size:58px;line-height:1;animation:2.4s ease-in-out infinite bob;display:inline-block}@keyframes bob{50%{transform:translateY(-6px)rotate(-4deg)}}.qtext{font:27px/1.3 var(--disp);word-break:keep-all;margin:0}.opts{gap:12px;margin-top:20px;display:grid}.opts.grid2{grid-template-columns:1fr 1fr}.opt{text-align:left;border:var(--line);box-shadow:var(--sh);font:700 17.5px/1.35 var(--body);word-break:keep-all;background:#fff;border-radius:16px;align-items:center;gap:12px;padding:16px;transition:transform 80ms,box-shadow 80ms,background .15s;display:flex}.opt .e{flex:none;font-size:28px}.opt:hover{background:#fff4c9}.opt:active,.opt.picked{box-shadow:1px 1px 0 var(--ink);background:var(--yellow);transform:translate(4px,4px)}.opts.grid2 .opt{text-align:center;flex-direction:column;gap:6px;padding:16px 8px}.loading{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:70vh;display:flex}.bounce{gap:10px;margin-bottom:26px;display:flex}.bounce img{border:var(--line);width:84px;height:84px;box-shadow:var(--sh-sm);border-radius:18px;animation:.9s ease-in-out infinite hop}.bounce img:nth-child(2){animation-delay:.15s}.bounce img:nth-child(3){animation-delay:.3s}@keyframes hop{50%{transform:translateY(-18px)rotate(6deg)}}.load-text{font:26px/1.3 var(--disp)}.friend{background:#fff4c9;align-items:center;gap:10px;margin:16px 0 0;padding:12px 14px;display:flex}.friend p{flex:1;margin:0;font-size:14.5px;font-weight:700}.friend .btn{flex:none;width:auto;padding:10px 12px;font-size:15px}.youare{text-align:center;margin:22px 0 6px;font-size:17px;font-weight:800}.big-code{font:84px/.95 var(--disp);text-align:center;color:var(--type);-webkit-text-stroke:3px var(--ink);paint-order:stroke fill;letter-spacing:2px;filter:drop-shadow(4px 4px 0 var(--ink));margin:0}.big-title{font:27px/1.25 var(--disp);text-align:center;word-break:keep-all;margin:10px 0 0}.cert{border:var(--line);box-shadow:var(--sh);background:#fffaf0;border-radius:6px;margin:22px 0 0;padding:12px;position:relative}.cert-in{border:2px solid var(--ink);outline:1px solid var(--ink);outline-offset:-6px;padding:18px 16px 16px}.cert-head{text-align:center}.cert-no{font:700 12px var(--serif);color:var(--mut)}.cert-head h3{font:800 31px/1.2 var(--serif);letter-spacing:6px;margin:4px 0 14px}.cert-body{align-items:center;gap:14px;display:flex}.cert-img{border:var(--line);width:46%;box-shadow:var(--sh-sm);background:#fff;border-radius:14px;flex:none;overflow:hidden}.cert-img img{aspect-ratio:1;object-fit:cover;width:100%}.cert-type .lbl{font:700 13px var(--serif);color:var(--mut)}.cert-type .code{font:46px/1 var(--disp);color:var(--type);-webkit-text-stroke:2px var(--ink);paint-order:stroke fill}.cert-type .adj{font:800 15px/1.35 var(--body);word-break:keep-all;margin-top:6px}.cert-type .shop{font:20px/1.3 var(--disp);word-break:keep-all}.cert-type .nick{color:var(--mut);word-break:keep-all;margin-top:4px;font-size:12.5px}.cert-table{border-collapse:collapse;width:100%;margin:16px 0 4px;font-size:14.5px}.cert-table th{font:700 13.5px var(--serif);text-align:left;border-top:1px solid var(--ink);color:#3b3850;width:34%;padding:8px 6px}.cert-table td{border-top:1px solid var(--ink);padding:8px 6px;font-weight:800}.cert-table tr:last-child th,.cert-table tr:last-child td{border-bottom:1px solid var(--ink)}.ibar{vertical-align:middle;border:2px solid var(--ink);background:#fff;border-radius:99px;width:46%;height:10px;margin-left:8px;display:inline-block;overflow:hidden}.ibar i{background:var(--red);width:0;height:100%;transition:width 1s ease-out .4s;display:block}.cert-stmt{font:700 16.5px/1.6 var(--serif);text-align:center;word-break:keep-all;margin:16px 0 6px}.cert-foot{font:700 13.5px var(--serif);justify-content:space-between;align-items:flex-end;min-height:70px;margin-top:12px;display:flex}.cert-foot .issuer{margin-right:46px;font-size:17px}.stamp{border:5px solid var(--red);width:96px;height:96px;color:var(--red);font:20px/1.05 var(--disp);text-align:center;opacity:0;mix-blend-mode:multiply;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;bottom:16px;right:20px;transform:rotate(-14deg)}.stamp:after{content:"";border:2px solid var(--red);border-radius:50%;position:absolute;inset:5px}.stamp.slam{animation:.5s cubic-bezier(.2,1.6,.4,1) forwards slam}@keyframes slam{0%{opacity:0;transform:scale(3.2)rotate(-30deg)}60%{opacity:.95;transform:scale(.9)rotate(-12deg)}to{opacity:.88;transform:scale(1)rotate(-14deg)}}.shake{animation:.35s .32s shake}@keyframes shake{20%{transform:translate(-4px,2px)}40%{transform:translate(4px,-2px)}60%{transform:translate(-3px,1px)}80%{transform:translate(2px,-1px)}}.tierline{background:var(--yellow);text-align:center;word-break:keep-all;margin:16px 0 0;padding:14px 16px;font-weight:700}.copyrow{gap:8px;margin:10px 0 0;display:flex}.copyrow .btn{min-width:0;box-shadow:var(--sh-sm);white-space:nowrap;border-radius:11px;flex:1;padding:9px 6px;font-size:13.5px}.axes{padding:16px}.axis{margin:10px 0}.axis-h{justify-content:space-between;font-size:14px;font-weight:800;display:flex}.axis-h span.on{color:var(--red)}.axis-bar{border:var(--line);background:#fff;border-radius:99px;height:16px;margin-top:4px;position:relative;overflow:hidden}.axis-bar i{background:var(--type);border-right:var(--line);width:50%;transition:width .9s ease-out;position:absolute;top:0;bottom:0;left:0}.traits{padding:16px 18px}.traits .one{font:21px/1.35 var(--disp);word-break:keep-all;margin:0 0 10px}.traits ul{margin:0;padding:0;list-style:none}.traits li{word-break:keep-all;border-top:2px dashed #d9d3c4;padding:9px 0 9px 30px;font-weight:600;position:relative}.traits li:before{content:"✔";border:2px solid var(--ink);background:var(--green);text-align:center;border-radius:6px;width:20px;height:20px;font-size:12px;line-height:16px;position:absolute;top:8px;left:4px}.quote{font:21px/1.35 var(--disp);word-break:keep-all;background:#fff;margin:16px 0 0;padding:16px 18px;position:relative}.quote small{font:700 12.5px var(--body);color:var(--mut);margin-bottom:4px;display:block}.duo{grid-template-columns:1fr 1fr;gap:12px;display:grid}.mate{text-align:center;padding:12px}.mate .tag{font:16px var(--disp);border:2px solid var(--ink);border-radius:99px;margin-bottom:8px;padding:4px 10px;display:inline-block}.mate.good .tag{background:var(--green)}.mate.bad .tag{background:var(--red);color:#fff}.mate img{aspect-ratio:1;object-fit:cover;border:2px solid var(--ink);border-radius:12px;width:100%}.mate b{font:22px var(--disp);margin-top:8px;display:block}.mate .sn{word-break:keep-all;font-size:12.5px;font-weight:700}.mate p{word-break:keep-all;color:#3b3850;margin:6px 0 0;font-size:13px}.tagfriend{margin-top:12px}.luck{align-items:center;gap:12px;padding:14px;display:flex}.swatch{border:var(--line);width:74px;height:74px;box-shadow:var(--sh-sm);border-radius:16px;flex:none}.luck b{font:21px var(--disp)}.luck .hex{color:var(--mut);font:700 14px ui-monospace,Menlo,monospace}.fits{flex-wrap:wrap;gap:6px;margin-top:6px;display:flex}.names{gap:14px;display:grid}.ncard{padding:16px;position:relative}.ncard.sel{outline:4px solid var(--red);outline-offset:3px}.ncard .rank{font:15px var(--disp);background:var(--yellow);border:2px solid var(--ink);border-radius:99px;padding:3px 10px;position:absolute;top:-14px;left:14px}.ncard .rank.r1{background:var(--red);color:#fff}.nrow{justify-content:space-between;align-items:center;gap:10px;margin-top:6px;display:flex}.nname{font:32px/1.1 var(--disp);word-break:break-all}.nname.pend{color:var(--mut);font-size:26px}.power{text-align:center;flex:none}.power b{font:34px/1 var(--disp);display:block}.power span{font-size:11.5px;font-weight:800}.grade{font:700 12px var(--body);border:2px solid var(--ink);border-radius:99px;margin-top:4px;padding:2px 8px;display:inline-block}.g-strong{background:var(--green)}.g-good{background:#b9d0ff}.g-fair{background:var(--yellow)}.g-weak{background:#ffb3ad}.badges{flex-wrap:wrap;gap:6px;margin:10px 0 0;display:flex}.nmore{border-top:2px dashed #d9d3c4;margin-top:10px;padding-top:10px}.stat{grid-template-columns:76px 1fr 30px;align-items:center;gap:8px;margin:6px 0;font-size:13.5px;font-weight:700;display:grid}.stat .sb{border:2px solid var(--ink);background:#fff;border-radius:99px;height:12px;overflow:hidden}.stat .sb i{background:var(--ink);height:100%;display:block}.stat .sv{text-align:right}.nmsg{word-break:keep-all;background:#f6f1e4;border-radius:10px;margin:10px 0 0;padding:10px 12px;font-size:13.5px}.nmsg:first-child{margin-top:0}.nbtns{gap:8px;margin-top:12px;display:flex}.nbtns button{border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink);background:#fff;border-radius:11px;flex:1;padding:9px 6px;font-size:14px;font-weight:800}.nbtns button.pick{background:var(--ink);color:#fff}.nbtns button.more{background:var(--yellow)}.nbtns button.more.on{background:#fff}.mycheck{margin-top:10px;padding:14px}.mycheck p{margin:0 0 8px;font-weight:800}.names-hint{color:var(--mut);word-break:keep-all;margin:-4px 0 14px;font-size:13.5px;font-weight:700}.names-hint b{color:var(--ink)}.mycheck-btn{margin-top:14px}.caret{margin-left:4px;transition:transform .15s;display:inline-block}[aria-expanded=true] .caret{transform:rotate(90deg)}.more-btn{text-align:left;border:var(--line);width:100%;box-shadow:var(--sh);background:#fff;border-radius:16px;justify-content:space-between;align-items:center;gap:10px;margin-top:30px;padding:14px 16px;transition:transform 80ms,box-shadow 80ms;display:flex}.more-btn:active{box-shadow:1px 1px 0 var(--ink);transform:translate(4px,4px)}.more-btn .more-t{min-width:0}.more-btn b{font:20px/1.2 var(--disp);display:block}.more-btn small{color:var(--mut);word-break:keep-all;margin-top:4px;font-size:12px;font-weight:700;display:block}.more-btn .caret{font:26px/1 var(--disp);flex:none;margin:0}.err{color:var(--red);min-height:1em;margin:6px 0 0;font-size:13.5px;font-weight:700}.imai{background:var(--ink);color:#fff;border-color:var(--ink);box-shadow:6px 6px 0 var(--red);margin-top:34px;padding:20px 18px}.imai h3{font:27px/1.25 var(--disp);word-break:keep-all;margin:0 0 6px}.imai h3 em{color:var(--yellow);font-style:normal}.imai p{color:#d9d6e8;word-break:keep-all;margin:0 0 12px;font-size:14.5px}.prompt{color:#fff;word-break:keep-all;background:#2c2a45;border:2px dashed #6c6890;border-radius:12px;margin:0 0 14px;padding:12px;font-size:14.5px;line-height:1.55}.imai .btn{background:var(--yellow);color:var(--ink);border-color:#fff;box-shadow:4px 4px #fff}.imai .fine{color:#a9a5c4;margin:10px 0 0;font-size:12px}.alltypes{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.alltypes button{border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink);background:#fff;border-radius:12px;padding:4px 4px 6px}.alltypes button.me{background:var(--yellow);outline:3px solid var(--red)}.alltypes img{aspect-ratio:1;object-fit:cover;border-radius:8px;width:100%}.alltypes b{font:15px var(--disp);margin-top:3px;display:block}.alltypes span{word-break:keep-all;font-size:10.5px;font-weight:700;line-height:1.2;display:block}.foot{color:var(--mut);text-align:center;word-break:keep-all;margin:28px 0 0;font-size:12.5px}.resultbar{z-index:20;padding:10px 12px calc(10px + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:var(--line);background:#fff7eaf0;display:none;position:fixed;bottom:0;left:0;right:0}.resultbar.on{display:block}.resultbar .in{gap:8px;max-width:480px;margin:0 auto;display:flex}.resultbar .main{flex-wrap:wrap;flex:1;gap:0 5px;min-width:0;padding:15px 8px;font-size:clamp(15px,4.6vw,19px)}.resultbar .main .ico,.resultbar .main .fix{white-space:nowrap;flex:none}.resultbar .main .nm{text-overflow:ellipsis;white-space:nowrap;flex:1 1 0;min-width:0;max-width:max-content;overflow:hidden}.barhint{background:var(--yellow);border:var(--line);max-width:480px;box-shadow:var(--sh-sm);border-radius:13px;align-items:flex-start;gap:6px;margin:0 auto;padding:7px 8px 7px 10px;display:flex;position:absolute;bottom:calc(100% + 6px);left:12px;right:12px}.barhint p{word-break:keep-all;margin:0;font-size:12px;font-weight:700;line-height:1.45}.barhint .chip{vertical-align:1px;margin-right:5px;padding:1px 7px;font-size:11px}.barhint .x{font:18px/1 var(--body);color:var(--ink);opacity:.65;background:0 0;border:0;flex:none;padding:0 2px}.barhint:after{content:"";box-sizing:border-box;background:var(--yellow);border-right:var(--line);border-bottom:var(--line);width:13px;height:13px;position:absolute;bottom:-8px;left:28px;transform:rotate(45deg)}.sq{border:var(--line);width:52px;box-shadow:var(--sh-sm);background:#fff;border-radius:13px;flex-direction:column;flex:none;justify-content:center;align-items:center;padding:6px 0;font-size:20px;line-height:1;display:flex}.sq small{margin-top:3px;font-size:10px;font-weight:800}body.has-bar .screen{padding-bottom:20px}.powered{text-align:center;padding:10px 16px 30px}body.has-bar .powered{padding-bottom:calc(var(--bar-room,calc(136px + env(safe-area-inset-bottom))) + 12px)}.powered a{color:var(--mut);font:700 12.5px var(--body);border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink);background:#fff;border-radius:999px;align-items:center;gap:8px;padding:7px 14px;text-decoration:none;display:inline-flex}.powered img{width:auto;height:15px}.toast{background:var(--ink);color:#fff;opacity:0;pointer-events:none;z-index:40;text-align:center;border-radius:12px;max-width:90vw;padding:11px 16px;font-size:14.5px;font-weight:700;transition:all .25s;position:fixed;bottom:96px;left:50%;transform:translate(-50%,20px)}.toast.on{opacity:1;transform:translate(-50%)}.sheet{z-index:30;background:#1c1b2e8c;justify-content:center;align-items:flex-end;display:none;position:fixed;inset:0}.sheet.on{display:flex}.sheet .box{border-radius:20px 20px 0 0;width:100%;max-width:480px;max-height:86vh;padding:18px 18px 26px;overflow:auto}.sheet img{border:var(--line);border-radius:16px;width:132px;margin:0 auto 8px}.confetti{pointer-events:none;z-index:25;position:fixed;inset:0;overflow:hidden}.confetti i{border:2px solid var(--ink);border-radius:3px;width:10px;height:16px;animation:linear forwards fall;position:absolute;top:-20px}@keyframes fall{to{transform:translateY(110vh)rotate(720deg)}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}.stamp{opacity:.88}}.about-wrap{margin-top:30px}.about{border-top:2px dashed #d9d3c4;margin-top:16px;padding-top:16px}.about:first-child{border-top:0;margin-top:0;padding-top:0}.about h2{font:21px/1.3 var(--disp);word-break:keep-all;margin:0 0 8px}.about h3{font:800 15px/1.45 var(--body);word-break:keep-all;margin:14px 0 2px}.about p{word-break:keep-all;margin:6px 0 0;font-size:14.5px}.about ul,.about ol{margin:8px 0 0;padding-left:20px;font-size:14.5px}.about li{word-break:keep-all;margin:4px 0}.about-links{padding-left:0;list-style:none}.about-links a{color:var(--ink);font-weight:800}.about-cta{text-align:center;margin:18px 0 0}.about-cta a{font:700 15px var(--body);color:var(--ink);border-bottom:2px solid var(--ink);word-break:keep-all;text-decoration:none;display:inline-block}.type-one{font:700 16.5px/1.5 var(--body);text-align:center;word-break:keep-all;margin:14px 0 18px}.type-img img{aspect-ratio:1}