*,:before,:after{box-sizing:border-box}html,body{margin:0;padding:0}body{color:#f2efe9;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#1c2033;min-height:100svh;font-family:-apple-system,BlinkMacSystemFont,Apple SD Gothic Neo,Noto Sans KR,Malgun Gothic,sans-serif;position:relative}body:before{content:"";z-index:0;pointer-events:none;background-color:#0000;background-image:radial-gradient(1px 1px at 11% 16%,#f2efe98c 0%,#0000 100%),radial-gradient(1px 1px at 79% 9%,#f2efe966 0%,#0000 100%),radial-gradient(1.5px 1.5px at 35% 41%,#f2efe952 0%,#0000 100%),radial-gradient(1px 1px at 61% 64%,#f2efe947 0%,#0000 100%),radial-gradient(1px 1px at 89% 28%,#f2efe96b 0%,#0000 100%),radial-gradient(1.5px 1.5px at 21% 77%,#f2efe942 0%,#0000 100%),radial-gradient(1px 1px at 51% 91%,#f2efe938 0%,#0000 100%),radial-gradient(1px 1px at 6% 55%,#f2efe933 0%,#0000 100%),radial-gradient(1px 1px at 93% 68%,#f2efe93d 0%,#0000 100%),radial-gradient(640px 640px at 82% -8%,#d9b56a1a 0%,#0000 70%),radial-gradient(520px 520px at 6% 105%,#8f8dc417 0%,#0000 70%),linear-gradient(#21253c 0%,#1c2033 42%,#171a2a 100%);background-position:0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0;background-repeat:no-repeat;background-size:auto,auto,auto,auto,auto,auto,auto,auto,auto,auto,auto,auto;background-attachment:scroll,scroll,scroll,scroll,scroll,scroll,scroll,scroll,scroll,scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box,padding-box,padding-box,padding-box,padding-box,padding-box,padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box,border-box,border-box,border-box,border-box,border-box,border-box,border-box,border-box;position:fixed;inset:0}#root{z-index:1;min-height:100svh;position:relative}button,input{font-family:inherit}a{color:inherit}.app{--shadow-card:inset 0 1px 0 #ffffff0d, 0 1px 2px #0000004d, 0 18px 44px -16px #0000008c;--shadow-card-sm:inset 0 1px 0 #ffffff0b, 0 1px 2px #00000040, 0 10px 24px -10px #00000073;--glow-gold:0 0 0 1px #d9b56a66, 0 10px 30px -8px #d9b56a47;flex-direction:column;align-items:center;max-width:480px;min-height:100svh;margin:0 auto;padding:32px 22px 44px;display:flex;position:relative}.app__header{flex-direction:column;align-items:center;gap:8px;margin-bottom:32px;display:flex}.app__brand{letter-spacing:4px;color:#d9b56a;text-transform:uppercase;text-shadow:0 0 18px #d9b56a38;margin:0;font-family:Georgia,Times New Roman,serif;font-size:14px}.card{width:100%;box-shadow:var(--shadow-card);background:linear-gradient(#f2efe90b 0%,#f2efe905 100%);border:1px solid #f2efe91a;border-radius:24px;flex-direction:column;gap:26px;padding:32px 24px 26px;display:flex}.progress{justify-content:center;gap:8px;display:flex}.progress__dot{background:#f2efe933;border-radius:50%;width:8px;height:8px;transition:background .3s,transform .3s,box-shadow .3s}.progress__dot.is-active{background:#d9b56a;transform:scale(1.15);box-shadow:0 0 10px #d9b56a8c}.question{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:22px;min-height:180px;display:flex}.question__title{letter-spacing:-.2px;color:#f2efe9;text-wrap:balance;margin:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(22px,6vw,27px);font-weight:500;line-height:1.42}.time-picker{justify-content:center;align-items:center;gap:4px;width:100%;max-width:260px;margin:0 auto;display:flex;position:relative}.time-picker__highlight{pointer-events:none;border-top:1px solid #d9b56a73;border-bottom:1px solid #d9b56a73;height:40px;position:absolute;top:50%;left:0;right:0;transform:translateY(-50%)}.time-picker__colon{color:#d9b56a;padding-bottom:1px;font-family:Georgia,Times New Roman,serif;font-size:21px}.wheel-col{scroll-snap-type:y mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;height:200px;padding:80px 0;overflow-y:auto}.wheel-col::-webkit-scrollbar{display:none}.wheel-col--period{width:68px}.wheel-col--hour{width:40px}.wheel-col--minute{width:52px}.wheel-item{scroll-snap-align:center;font-variant-numeric:tabular-nums;color:#f2efe952;cursor:pointer;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;height:40px;font-family:Georgia,Times New Roman,serif;font-size:17px;transition:color .2s,font-size .2s;display:flex}.wheel-item.is-selected{color:#d9b56a;font-size:21px;font-weight:600}.chip-group{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.chip-group--vertical{flex-direction:column;align-items:stretch;width:100%}.chip{color:#f2efe9;cursor:pointer;background:0 0;border:1px solid #f2efe940;border-radius:999px;min-height:44px;padding:12px 18px;font-size:15px;transition:background .25s,border-color .25s,color .25s,transform .2s}.chip.is-selected{color:#1c2033;box-shadow:var(--glow-gold);background:#d9b56a;border-color:#d9b56a;font-weight:600}.chip:active{transform:scale(.97)}.chip-group--vertical .chip{text-align:left}.nav-buttons{gap:12px;margin-top:6px;display:flex}.btn{cursor:pointer;border:1px solid #0000;border-radius:16px;flex:1;min-height:50px;font-size:16px;font-weight:600;transition:transform .2s,opacity .2s,box-shadow .25s,filter .2s}.btn:active{transform:scale(.97)}.btn--primary{color:#1c2033;background:#d9b56a;box-shadow:0 10px 24px -10px #d9b56a8c}.btn--ghost{color:#f2efe9;background:0 0;border-color:#f2efe94d}.btn--ghost:disabled{opacity:.35;cursor:not-allowed}@media (hover:hover) and (pointer:fine){.btn--primary:hover{filter:brightness(1.06)}.btn--ghost:hover:not(:disabled){color:#d9b56a;border-color:#d9b56a80}.chip:hover:not(.is-selected){border-color:#d9b56a66}.mode-tab:hover:not(.is-active){color:#d9b56a;border-color:#d9b56a66}.result-card:hover{transform:translateY(-3px)}.secondary-link:hover{color:#a9a7d9;border-color:#d9b56a59}}.calculating{text-align:center;align-items:center;gap:22px;padding:64px 24px}.calculating__cloud{opacity:1}.calculating__text{color:#f2efe9b3;letter-spacing:.2px;font-size:15px}.result{text-align:center;flex-direction:column;align-items:center;gap:40px;width:100%;padding:12px 4px 8px;display:flex}.result__hero{flex-direction:column;align-items:center;gap:10px;display:flex}.result__label{color:#b7addb;letter-spacing:1.8px;margin:0;font-size:14px;font-weight:500}.result__age-wrap{justify-content:center;align-items:baseline;gap:4px;display:flex}.result__age{font-variant-numeric:tabular-nums;letter-spacing:-3px;color:#d9b56a;text-shadow:0 0 56px #d9b56a66,0 0 110px #d9b56a2e;font-family:Georgia,Times New Roman,serif;font-size:clamp(108px,34vw,176px);line-height:.9}.result__unit{color:#d9b56a;font-family:Georgia,Times New Roman,serif;font-size:clamp(28px,8vw,40px)}.result__info-card{width:100%;box-shadow:var(--shadow-card-sm);background:linear-gradient(#f2efe90f 0%,#f2efe906 100%);border:1px solid #f2efe91f;border-radius:22px;flex-direction:column;gap:20px;padding:28px 24px;display:flex}.result__summary{text-align:center;color:#9c9ac4;letter-spacing:.1px;margin:0;font-size:15px}.result__summary strong{color:#f2efe9;font-weight:600}.result__divider{background:#f2efe91f;height:1px}.tips-wrap{flex-direction:column;gap:14px;width:100%;display:flex}.tips__heading{letter-spacing:1.4px;text-transform:uppercase;color:#d9b56a;margin:0;font-size:12.5px;font-weight:600}.tips{text-align:left;flex-direction:column;gap:14px;width:100%;margin:0;padding:0;list-style:none;display:flex}.tips__item{color:#f2efe9;padding-left:20px;font-size:14.5px;line-height:1.6;position:relative}.tips__item:before{content:"•";color:#d9b56a;font-size:20px;line-height:1.6;position:absolute;top:-2px;left:0}.share-row{flex-wrap:wrap;justify-content:center;gap:14px;width:100%;display:flex}.btn--pill{border-radius:999px;flex:none;min-height:54px;padding:0 30px}.email-form{width:100%;box-shadow:var(--shadow-card-sm);background:linear-gradient(#f2efe90f 0%,#f2efe906 100%);border:1px solid #f2efe91f;border-radius:22px;flex-direction:column;align-items:center;gap:14px;padding:24px 24px 26px;display:flex}.email-form__label{color:#a5a3ce;text-align:center;font-size:14px}.email-form__row{flex-direction:column;gap:12px;width:100%;display:flex}.email-form__input{color:#f2efe9;text-align:center;background:#f2efe90d;border:1px solid #f2efe940;border-radius:16px;width:100%;min-height:50px;padding:0 18px;font-size:15px;transition:border-color .25s}.email-form__input::placeholder{color:#f2efe959}.email-form__input:focus{border-color:#d9b56a;outline:none}.email-form .btn--primary{border-radius:999px;width:100%}.email-form__done{color:#d9b56a;text-align:center;margin:0;font-size:14px}.result__footer{flex-direction:column;align-items:center;gap:12px;display:flex}.result-footer-links{align-items:center;gap:10px;display:flex}.result-footer-links__dot{color:#f2efe94d;font-size:13px}.restart{color:#f2efe973;text-underline-offset:3px;cursor:pointer;background:0 0;border:none;font-size:13px;text-decoration:underline;transition:color .2s}.restart:hover{color:#f2efe9b3}.disclaimer{color:#f2efe959;max-width:320px;margin:0;font-size:11.5px;line-height:1.55}.toast{color:#1c2033;text-align:center;background:#f2efe9;border-radius:999px;max-width:90vw;padding:12px 20px;font-size:14px;animation:.25s toast-in;position:fixed;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 10px 30px #0000004d}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%)}}@media (width>=600px){.app{padding-top:56px}}.calculator{text-align:center;flex-direction:column;align-items:center;gap:40px;width:100%;display:flex}.calculator__hero{flex-direction:column;align-items:center;gap:10px;display:flex}.calculator__title{letter-spacing:-.3px;color:#f2efe9;text-wrap:balance;margin:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(25px,7.5vw,31px);font-weight:500;line-height:1.36}.calculator__subtitle{color:#8f8dc4;letter-spacing:.1px;margin:0;font-size:14px}.mode-select{flex-direction:column;align-items:center;gap:18px;width:100%;display:flex}.mode-tabs{gap:8px;width:100%;display:flex}.mode-tab{color:#f2efe9;cursor:pointer;background:linear-gradient(#f2efe908 0%,#f2efe903 100%);border:1px solid #f2efe92e;border-radius:14px;flex:1;min-height:50px;padding:0 6px;font-size:13.5px;font-weight:600;line-height:1.3;transition:background .25s,border-color .25s,color .25s,box-shadow .25s,transform .2s}.mode-tab.is-active{color:#1c2033;box-shadow:var(--glow-gold);background:#d9b56a;border-color:#d9b56a}.mode-tab:active{transform:scale(.97)}.mode-input{flex-direction:column;align-items:center;gap:14px;width:100%;display:flex}.mode-input__label{color:#8f8dc4;margin:0;font-size:14px}.result-block{flex-direction:column;gap:16px;width:100%;display:flex}.result-heading{color:#8f8dc4;letter-spacing:.1px;margin:0;font-size:14px}.result-grid{grid-template-columns:repeat(2,1fr);gap:14px;width:100%;display:grid}.result-card{box-shadow:var(--shadow-card-sm);background:linear-gradient(165deg,#262b48 0%,#1f2239 100%);border:1px solid #f2efe914;border-radius:20px;flex-direction:column;align-items:center;gap:7px;padding:22px 12px;transition:transform .25s,box-shadow .25s,border-color .25s;display:flex}.result-card:active{transform:scale(.97)}.result-card.is-recommended{box-shadow:var(--glow-gold), var(--shadow-card-sm);background:linear-gradient(165deg,#333a63 0%,#262b4a 100%);border:2px solid #d9b56a}.result-card__time{font-variant-numeric:tabular-nums;color:#f2efe9;margin:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(21px,6vw,25px);font-weight:500}.result-card__meta{color:#8f8dc4;letter-spacing:.1px;margin:0;font-size:12.5px}.result-card__stars{letter-spacing:2px;color:#d9b56a;margin:0;font-size:15px}.result-card.is-recommended .result-card__stars{text-shadow:0 0 14px #d9b56a8c}.secondary-link{color:#8f8dc4;cursor:pointer;background:linear-gradient(#f2efe909 0%,#f2efe904 100%);border:1px solid #f2efe91f;border-radius:16px;width:100%;padding:15px 20px;font-size:14px;transition:border-color .25s,color .25s,transform .2s}.secondary-link:active{transform:scale(.98)}.fade-in,.result__age-wrap,.calculating__cloud{opacity:1}@media (prefers-reduced-motion:no-preference){.fade-in{animation:.5s cubic-bezier(.16,1,.3,1) both fadeInUp}.result__age-wrap{animation:.55s cubic-bezier(.2,1,.3,1) 50ms both popIn}.result-card{animation:.5s cubic-bezier(.16,1,.3,1) both fadeInUp}.result-grid .result-card:first-child{animation-delay:0s}.result-grid .result-card:nth-child(2){animation-delay:60ms}.result-grid .result-card:nth-child(3){animation-delay:.12s}.result-grid .result-card:nth-child(4){animation-delay:.18s}.calculating__cloud{animation:2.4s ease-in-out infinite float}.cloud-logo__star{animation:3.6s ease-in-out infinite twinkle}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes popIn{0%{opacity:0;transform:scale(.86)}to{opacity:1;transform:scale(1)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes twinkle{0%,to{opacity:.6}50%{opacity:1}}