:root{--red: #D8081C;--red-dark: #B00616;--pink: #FDEEF0;--pink-line: #F7D5DA;--ink: #111111;--muted: #6E6E73;--line: #ECECEE;--page: #FFFFFF}:root{color-scheme:light;font-family:-apple-system,BlinkMacSystemFont,Apple SD Gothic Neo,Pretendard,Noto Sans KR,sans-serif;line-height:1.4;color:var(--ink);background:var(--page);--gutter: 20px}*{box-sizing:border-box}body{margin:0;background:var(--page);word-break:keep-all;-webkit-text-size-adjust:100%}button,input{font:inherit;color:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}button:disabled{opacity:.5;cursor:default}button:focus-visible,input:focus-visible,a:focus-visible,.terms:focus-visible{outline:3px solid var(--red);outline-offset:2px}[hidden]{display:none!important}h1{font-size:1.75rem;font-weight:800;letter-spacing:-.6px;line-height:1.3;margin:4px 0 8px}h1:focus{outline:none}h1 em,h2 em{color:var(--red);font-style:normal}h2{font-size:1.0625rem;font-weight:700;margin:0}.app{max-width:560px;margin:0 auto;min-height:100dvh}.step-label{margin:14px 0 0;font-size:.9375rem;color:var(--muted);letter-spacing:.3px}.step-label b{color:var(--red);font-weight:700}.lead{color:var(--muted);font-size:1rem;margin:0 0 16px;text-wrap:pretty}.progress{display:flex;gap:6px;flex:1}.progress span{height:4px;border-radius:2px;background:var(--line);flex:1}.progress .on{background:var(--red)}.progress .past{background:#f3a8b0}.tile{width:44px;height:44px;border-radius:13px;background:var(--pink);display:grid;place-items:center;flex-shrink:0}.icon{width:24px;height:24px;fill:none;stroke:var(--red);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.page{--cta-h: 82px;position:relative;height:100vh;height:100dvh;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top)}.page.two{--cta-h: 124px}.page-body{flex:1;min-height:0;overflow-y:auto;padding:14px var(--gutter) 12px;display:flex;flex-direction:column}.page-body>.progress{flex:none}.cta{flex:none;box-sizing:content-box;height:var(--cta-h);padding:0 var(--gutter) env(safe-area-inset-bottom);display:flex;flex-direction:column;justify-content:center}.cta>*{width:100%;max-width:520px;margin:0 auto}.primary{width:100%;min-height:58px;border:0;border-radius:29px;background:var(--red);color:#fff;font-size:1.125rem;font-weight:700;display:flex;align-items:center;justify-content:center;position:relative;box-shadow:0 6px 18px #d8081c40;transition:background-color .15s,opacity .15s}.primary span{position:absolute;right:26px;font-size:1.25rem}.primary:active{background:var(--red-dark)}.primary:disabled{opacity:.7;box-shadow:none}.primary.off{opacity:.5}a.primary{text-decoration:none}.secondary{min-height:50px;border-radius:25px;border:1.5px solid var(--line);background:#fff;font-weight:600;padding:0 20px}.text-button{min-height:44px;margin-top:2px;border:0;background:none;color:var(--muted);font-size:1rem;font-weight:600}.button-spinner{position:absolute;right:24px;width:18px;height:18px;border-radius:50%;border:2.5px solid rgba(255,255,255,.45);border-top-color:#fff;animation:spin .8s linear infinite}.icon-button{border:0;background:none;font-size:2rem;line-height:1;min-width:40px;min-height:40px;padding:0}.topbar{display:flex;align-items:center;gap:10px}.topbar-end{width:40px;flex-shrink:0}@keyframes spin{to{transform:rotate(360deg)}}@keyframes rise{0%{opacity:0;transform:translateY(10px)}}@keyframes fade-in{0%{opacity:0}}.toast-slot{position:absolute;left:var(--gutter);right:var(--gutter);bottom:calc(var(--cta-h) + env(safe-area-inset-bottom) + 2px);display:flex;justify-content:center;pointer-events:none;z-index:3}.toast{margin:0;max-width:100%;padding:10px 16px;border-radius:14px;background:#1c1c1eeb;color:#fff;font-size:.875rem;font-weight:600;text-align:center;box-shadow:0 6px 20px #0000002e;animation:rise .2s ease-out}.intro h1{margin-top:4px}.features{list-style:none;padding:0;margin:0 0 14px;display:grid;gap:12px}.features li{display:flex;align-items:center;gap:14px}.features b{display:block;font-size:1rem}.features small{display:block;color:var(--muted);font-size:.875rem;line-height:1.35}.consent{margin-top:auto}.consent.open{flex:1;min-height:0;display:flex;flex-direction:column;margin-top:0}.consent-row{display:flex;align-items:center;gap:4px}.consent-row label{flex:1;display:flex;gap:8px;align-items:flex-start;font-size:.9375rem;text-wrap:balance}.consent input,.sharing input{flex-shrink:0;width:20px;height:20px;margin:0;accent-color:var(--red)}.consent-more{flex-shrink:0;width:40px;height:40px;border:0;background:none;display:grid;place-items:center;padding:0}.consent-more svg{width:22px;height:22px;fill:none;stroke:var(--muted);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}.consent-more.open svg{transform:rotate(180deg)}.consent.nudge .consent-row label{color:var(--red)}.consent-note{margin:0 0 4px 28px;color:var(--red);font-size:.8125rem;font-weight:600}.terms{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;margin:2px 0 4px 28px;background:#f6f6f7;border-radius:12px;padding:12px 14px;font-size:.8125rem;color:#3a3a3c}.terms h3{font-size:.8125rem;font-weight:700;margin:10px 0 2px}.terms section:first-child h3{margin-top:0}.terms p{margin:0}.sharing{display:flex;gap:8px;align-items:flex-start;color:var(--muted);font-size:.8125rem;margin-top:6px;text-wrap:pretty}.state .page-body{align-items:center;text-align:center;padding-bottom:28px}.state .page-body>:first-child{margin-top:auto}.state .page-body>:last-child{margin-bottom:auto}.state-art{margin-bottom:18px}.tile.big{width:72px;height:72px;border-radius:22px}.tile.big .icon{width:34px;height:34px}.state h1{font-size:1.5rem;margin:0 0 8px}.state .lead{max-width:310px;margin:0;text-wrap:balance}.path{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 8px;margin:16px 0 0}.path>span:not(.sr){padding:7px 11px;border-radius:10px;background:var(--pink);font-size:.875rem;font-weight:600}.path b{color:var(--red)}.path-note{margin:12px 0 0;color:var(--muted);font-size:.8125rem}.nowrap{white-space:nowrap}.path i{width:7px;height:7px;border-top:2px solid #B5B5BA;border-right:2px solid #B5B5BA;transform:rotate(45deg);margin-left:-2px}.spinner{width:44px;height:44px;border-radius:50%;border:4px solid var(--pink);border-top-color:var(--red);animation:spin .9s linear infinite}.load{width:min(280px,100%);margin:18px 0 0}.load-bar{height:8px;border-radius:4px;background:var(--pink);overflow:hidden}.load-bar i{display:block;height:100%;background:var(--red);border-radius:4px;transition:width .2s linear}.load-label{margin:10px 0 0;font-size:.9375rem;font-weight:600;font-variant-numeric:tabular-nums}.load-note{margin:18px 0 0;max-width:300px;color:var(--muted);font-size:.9375rem}.screen.scan{height:100vh;height:100dvh;display:flex;flex-direction:column}.scan-head{padding:calc(env(safe-area-inset-top) + 8px) 16px 10px;background:#fff}.help-button{border:0;background:none;color:var(--ink);width:40px;height:40px;padding:0;display:grid;place-items:center}.help-button:before{content:"?";display:grid;place-items:center;width:22px;height:22px;border:1.5px solid currentColor;border-radius:50%;font-size:.8125rem;font-weight:700}.scan-head .step-label{margin-top:6px;font-size:.8125rem}.scan-head h1{font-size:1.5rem;margin:2px 0 4px}.status{position:absolute;top:12px;left:50%;transform:translate(-50%);width:max-content;max-width:calc(100% - 24px);z-index:1;display:flex;align-items:flex-start;gap:8px;margin:0;padding:8px 16px;border-radius:20px;background:#303030e0;color:#fff;font-size:.9375rem;font-weight:600;line-height:1.35;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.status i{width:8px;height:8px;border-radius:50%;background:#ff3b30;flex-shrink:0;margin-top:.45em}.status.scan i{animation:blink 1s ease-in-out infinite}.status.done i{background:#5be33b}.viewport{position:relative;flex:1;min-height:0;background:#1a1a1a;overflow:hidden}.viewport video,.viewport .overlay,.ghosts{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.viewport video{object-fit:cover;object-position:50% 0}@keyframes blink{50%{opacity:.25}}.ghosts{pointer-events:none}.ghost>path{fill:#ffffff38;stroke:#fffffff2;stroke-width:2px;vector-effect:non-scaling-stroke;transition:fill .3s,stroke .3s}.ghost.done>path{fill:#5be33b42;stroke:#5be33b}.ghost .tick{transform-box:fill-box;transform-origin:center;animation:tick-pop .35s cubic-bezier(.2,.8,.3,1.3) both}.ghost .tick circle{fill:#22b04b;stroke:#fff;stroke-width:1.6}.ghost .tick path{fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:16;stroke-dashoffset:16;animation:draw .3s .15s ease-out forwards}@keyframes tick-pop{0%{transform:scale(.3);opacity:0}}@keyframes draw{to{stroke-dashoffset:0}}.tips-panel{position:absolute;left:12px;right:12px;bottom:12px;background:#282828db;color:#fff;border-radius:18px;padding:14px 10px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.tips{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:6px;text-align:center;font-size:.8125rem}.tips .icon{stroke:#fff;width:24px;height:24px;display:block;margin:0 auto 6px}.retake-actions{display:flex;gap:8px;margin-top:14px}.retake-actions .primary{min-height:50px;font-size:1rem}.retake-actions .secondary{background:transparent;color:#fff;border-color:#fff6}.posture{position:absolute;left:12px;right:12px;bottom:12px;display:flex;align-items:center;gap:14px;padding:12px 40px 14px 12px;border-radius:18px;cursor:pointer;background:#282828e0;color:#fff;text-align:left;font-size:.9375rem;line-height:1.4;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);overflow:hidden;animation:rise .28s ease-out both}.posture-art{width:64px;height:64px;flex-shrink:0}.posture-card{fill:#ffffff1a;stroke:#fff;stroke-width:1.6;stroke-dasharray:4 3}.posture-thumb{fill:#ffffff47;stroke:#ffffffe6;stroke-width:1.4}.posture-nail{fill:#f3a8b0}.posture-text{text-wrap:balance}.posture-text b{color:#fff}.posture-close{position:absolute;top:4px;right:4px;width:36px;height:36px;border:0;padding:0;background:none}.posture-close:before,.posture-close:after{content:"";position:absolute;left:11px;top:17px;width:14px;height:2px;border-radius:1px;background:#ffffffb3;transform:rotate(45deg)}.posture-close:after{transform:rotate(-45deg)}.posture-timer{position:absolute;left:0;right:0;bottom:0;height:3px;background:#ffffff73;transform-origin:left;animation:shrink var(--posture-ms, 3s) linear var(--posture-delay, 0s) forwards}@keyframes shrink{to{transform:scaleX(0)}}.switch{position:fixed;top:0;right:0;bottom:0;left:0;z-index:5;max-width:560px;margin:0 auto;background:var(--page);animation:fade-in .2s ease-out}.switch .page-body{padding:8px 16px 12px}.switch-main{margin:auto 4px;padding-bottom:12px;text-align:center}.switch-art{display:flex;align-items:center;justify-content:center;gap:18px;margin-bottom:6px}.hand-tile{margin:0;display:grid;justify-items:center;gap:8px;font-size:.875rem;font-weight:700;color:var(--muted)}.hand-tile .tile{position:relative;width:84px;height:84px;border-radius:26px}.hand-tile .icon{width:52px;height:52px;stroke-width:1.5}.hand-tile.left .icon{transform:scaleX(-1)}.hand-tile.next .tile{background:#fff;box-shadow:inset 0 0 0 2px var(--red),0 8px 22px #d8081c24}.hand-tile.next figcaption{color:var(--red)}.badge{position:absolute;top:-7px;right:-7px;width:28px;height:28px;border-radius:50%;background:var(--red);border:3px solid #fff}.badge:after{content:"";position:absolute;left:7px;top:3.5px;width:6px;height:11px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}.switch-arrow{position:relative;width:26px;height:2px;margin-bottom:26px;background:#d9d9de;border-radius:1px}.switch-arrow:after{content:"";position:absolute;right:0;top:-4px;width:8px;height:8px;border-top:2px solid #D9D9DE;border-right:2px solid #D9D9DE;transform:rotate(45deg)}.switch .step-label{margin-top:18px}.switch .lead{max-width:300px;margin:0 auto;text-wrap:balance}.step-row{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-top:12px}.step-row .step-label{margin:0}.upload-note{margin:0;color:var(--muted);font-size:.75rem;font-variant-numeric:tabular-nums;white-space:nowrap}.result h1{font-size:min(1.5rem,6.4vw);margin:2px 0 6px}.result .lead{font-size:.9375rem;margin-bottom:14px}.tag-note{display:inline-block;margin-left:2px;padding:0 7px;border-radius:6px;background:#f2f2f4;font-size:.75rem;line-height:1.6;color:var(--muted);white-space:nowrap;vertical-align:1px}.hand-card{background:#f7f7f8;border-radius:18px;padding:8px 10px 10px}.hand-card+.hand-card{margin-top:10px}.hand-card.editing{background:#fff;box-shadow:inset 0 0 0 1.5px #f7d5da}.hand-head{display:flex;align-items:center;gap:6px;padding:0 2px 8px 4px}.hand-head h2{min-width:3.1em;font-size:1rem}.unit{flex:1;min-width:0;font-size:.75rem;color:var(--muted)}.unit.bad{color:var(--red);font-weight:700}.pill-button{flex-shrink:0;display:inline-flex;align-items:center;gap:4px;min-height:34px;padding:0 11px;border:1px solid #E2E2E6;border-radius:17px;background:#fff;font-size:.8125rem;font-weight:600;color:var(--ink)}.pill-button .icon{width:14px;height:14px;stroke:var(--muted);stroke-width:2}.pill-button.on{border-color:var(--red);background:var(--red);color:#fff}.pill-button.on .icon{stroke:#fff}.nails{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}.nails li{display:flex;flex-direction:column;align-items:center;min-width:0;text-align:center}.nails img,.nails .thumb-empty{width:100%;aspect-ratio:1;border-radius:10px;object-fit:cover;background:#e9e9ec;display:grid;place-items:center}.finger-name{margin-top:5px;font-size:.75rem;line-height:1.2;color:var(--muted)}.nails .width{margin-top:1px;font-size:.9375rem;line-height:1.25;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.2px}.nails .own{min-height:15px;padding:0 4px;border-radius:5px;font-size:.75rem;line-height:1.25;font-weight:700;color:var(--red);font-variant-numeric:tabular-nums}.missing .thumb-empty{background:#fff;border:1.5px dashed #F3A8B0}.missing .thumb-empty .icon{width:16px;height:16px;stroke:#f3a8b0;stroke-width:2}.missing .width{font-size:.75rem;line-height:1.5625;font-weight:700;color:var(--red);letter-spacing:0}.missing.nudge0 .thumb-empty{animation:nudge-a .7s ease-out}.missing.nudge1 .thumb-empty{animation:nudge-b .7s ease-out}@keyframes nudge-a{0%,60%{background:var(--pink);border-color:var(--red)}}@keyframes nudge-b{0%,60%{background:var(--pink);border-color:var(--red)}}.flash .own{animation:flash 1.6s ease-out}@keyframes flash{0%,35%{background:#fbd3d8}}.own-input{width:100%;min-width:0;height:32px;margin-top:3px;border:1.5px solid #F3A8B0;border-radius:16px;background:#fff;text-align:center;font-size:16px;font-weight:700;color:var(--red);padding:0 2px;font-variant-numeric:tabular-nums}.own-input:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 3px #d8081c24}.own-input::placeholder{color:#f3a8b0;font-weight:600}.own-input.bad{border-color:var(--red);background:var(--pink)}.serial .page-body{text-align:center}.serial .topbar{position:absolute;top:calc(env(safe-area-inset-top) + 6px);left:12px}.serial .upload-note{margin-top:10px}.issued svg{width:72px;height:72px;margin:0 auto 4px;display:block;fill:none;stroke:var(--red);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.issued circle{fill:var(--pink);stroke:none}.serial h1{margin:0 0 6px}.serial .lead{font-size:.9375rem;margin-bottom:14px}.code-card{background:var(--pink);border-radius:18px;padding:12px 14px 10px;margin:0 0 10px}.code-head{display:flex;align-items:center;justify-content:center;position:relative;color:var(--muted);font-size:.875rem}.copy{position:absolute;right:0;display:inline-flex;align-items:center;gap:3px;border:0;background:none;color:var(--red);font-size:.8125rem;font-weight:700;padding:4px 0}.copy .icon{width:15px;height:15px}.code{margin:8px 0 6px;background:#fff;border-radius:12px;padding:11px 8px;font-size:1.5rem;font-weight:800;letter-spacing:3px;font-variant-numeric:tabular-nums;user-select:all;-webkit-user-select:all}.code-card small{color:var(--muted);font-size:.8125rem}.use-card{background:#f7f7f8;border-radius:18px;padding:12px 14px 14px;text-align:left}.use-card h2{font-size:.9375rem;margin-bottom:8px}.use-card ol{counter-reset:n;list-style:none;margin:0;padding:0;display:grid;gap:8px}.use-card li{counter-increment:n;display:flex;align-items:center;gap:9px;font-size:.84375rem;color:#3a3a3c}.use-card li:before{content:counter(n);flex-shrink:0;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--pink);color:var(--red);font-size:.75rem;font-weight:800}.serial.fresh .issued circle{transform-box:fill-box;transform-origin:center;animation:tick-pop .45s cubic-bezier(.2,.8,.3,1.25) both}.serial.fresh .issued .tick{stroke-dasharray:34;stroke-dashoffset:34;animation:draw .4s .3s ease-out forwards}.serial.fresh .issued .rays{animation:fade-in .3s .6s both}.serial.fresh .code{animation:rise .45s .55s cubic-bezier(.2,.8,.3,1) both}@media(prefers-reduced-motion:reduce){.ghost .tick,.posture,.posture-timer,.switch,.toast,.missing .thumb-empty,.serial.fresh *,.spinner,.button-spinner,.status.scan i,.flash .own{animation:none!important}.ghost .tick path,.serial.fresh .issued .tick{animation:none!important;stroke-dashoffset:0}.flash .own{background:#fbd3d8}.posture-timer{display:none}.ghost>path,.primary,.consent-more svg,.load-bar i{transition:none}}
