@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--bg-dark: #09090b;--panel-bg: #111113;--card-bg: #18181A;--text-primary: #ffffff;--text-secondary: #a1a1aa;--text-muted: rgba(255, 255, 255, .75);--text-faint: rgba(255, 255, 255, .7);--primary-color: #a688fa;--primary-hover: #8b5cf6;--btn-text: #1a0636;--input-bg: #27272a;--input-border: #3f3f46;--ring-color: #a688fa;--border-radius-lg: 16px;--border-radius-md: 8px;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--container-border: rgba(255, 255, 255, .05);--container-shadow: 0 20px 40px rgba(0, 0, 0, .4);--autocomplete-shadow: 0 10px 25px rgba(0, 0, 0, .5);--autocomplete-item-border: rgba(255, 255, 255, .05);--autocomplete-hover: rgba(255, 255, 255, .05);--select-arrow-url: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");--chart-panel-bg: rgba(255, 255, 255, .02);--chart-panel-border: rgba(255, 255, 255, .05);--chart-panel-shadow: inset 0 0 40px rgba(0, 0, 0, .2);--bullet-color: var(--primary-color)}@media(prefers-color-scheme:light){:root{--bg-dark: #efe9ff;--panel-bg: #ffffff;--card-bg: #f5f0ff;--text-primary: #1a0d38;--text-secondary: #6b5e99;--text-muted: rgba(26, 13, 56, .78);--text-faint: rgba(26, 13, 56, .68);--primary-color: #7c3aed;--primary-hover: #6d28d9;--btn-text: #ffffff;--input-bg: #ede8ff;--input-border: #c4b5fd;--ring-color: #7c3aed;--container-border: rgba(124, 58, 237, .18);--container-shadow: 0 20px 40px rgba(90, 40, 180, .14);--autocomplete-shadow: 0 10px 25px rgba(124, 58, 237, .18);--autocomplete-item-border: rgba(26, 13, 56, .08);--autocomplete-hover: rgba(124, 58, 237, .07);--select-arrow-url: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a0d38' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");--chart-panel-bg: rgba(124, 58, 237, .04);--chart-panel-border: rgba(124, 58, 237, .12);--chart-panel-shadow: inset 0 0 40px rgba(124, 58, 237, .06);--bullet-color: var(--primary-color)}}*{box-sizing:border-box;margin:0;padding:0;font-family:var(--font-sans)}body{background-color:var(--bg-dark);color:var(--text-primary);min-height:100vh;display:flex;align-items:center;justify-content:center;transition:background-color .3s ease,color .3s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn .4s ease-out forwards}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--input-border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}#root{width:100%;display:flex;justify-content:center}.app-container{width:100%;max-width:100%;display:flex;justify-content:center;align-items:center}.split-screen-container{display:flex;width:900px;height:600px;background-color:var(--panel-bg);border-radius:var(--border-radius-lg);box-shadow:var(--container-shadow);overflow:hidden;border:1px solid var(--container-border);transition:background-color .3s ease,box-shadow .3s ease}.left-panel{flex:1;padding:40px;display:flex;flex-direction:column}.step-container{display:flex;flex-direction:column;height:100%;width:100%}.step-content{display:flex;flex-direction:column;flex:1;width:100%;align-items:stretch}.back-button,.skip-button{background:none;border:none;color:var(--text-primary);font-size:14px;font-weight:500;display:flex;align-items:center;gap:4px;cursor:pointer;transition:color .2s}.skip-button{color:var(--text-secondary);border:1px solid var(--input-border);padding:6px 12px;border-radius:var(--border-radius-md)}.back-button:disabled{opacity:.5;cursor:not-allowed}.back-button:hover:not(:disabled),.skip-button:hover{color:var(--text-primary)}.step-title{font-size:24px;font-weight:600;margin-bottom:8px}.step-subtitle{font-size:14px;color:var(--text-secondary);margin-bottom:24px}.continue-button{width:100%;background:linear-gradient(135deg,var(--primary-color) 0%,#8b5cf6 100%);color:var(--btn-text);border:none;padding:16px;font-size:16px;font-weight:700;border-radius:var(--border-radius-md);cursor:pointer;transition:all .3s ease;margin-top:24px}.continue-button:hover{background-color:var(--primary-hover)}.right-panel{flex:1;padding:16px 16px 16px 0}.graphic-canvas{width:100%;height:100%;border-radius:var(--border-radius-lg);position:relative;overflow:hidden;transition:background .5s ease}.sparkle-icon{position:absolute;top:32px;left:32px;z-index:10}.shape-circle-1,.shape-circle-2{position:absolute;border-radius:50%;transition:all .5s ease}.graphic-step-1,.graphic-step-2{background:linear-gradient(180deg,#935a8f,#db8f59)}.graphic-step-3{background:linear-gradient(180deg,#442a63,#ce886a,#6aabb1)}.graphic-step-4,.graphic-step-5{background:linear-gradient(180deg,#6c6eb5,#87a9b4,#90d3aa)}.graphic-step-1 .shape-circle-1,.graphic-step-2 .shape-circle-1,.graphic-step-3 .shape-circle-1{width:400px;height:400px;background:#0000001a;bottom:-150px;right:-100px;box-shadow:inset 0 0 50px #0000001a}.graphic-step-1 .shape-circle-2,.graphic-step-2 .shape-circle-2,.graphic-step-3 .shape-circle-2{width:600px;height:600px;background:#0000000d;bottom:-250px;right:-200px}.graphic-step-4 .shape-circle-1,.graphic-step-5 .shape-circle-1{width:300px;height:300px;background:#fff;top:-50px;right:-50px;box-shadow:0 0 50px #fff3}.graphic-step-4 .shape-circle-2,.graphic-step-5 .shape-circle-2{width:400px;height:400px;background:#ffffff1a;top:-100px;right:-100px}.graphic-step-6{background:var(--chart-panel-bg);border:1px solid var(--chart-panel-border);display:flex;align-items:center;justify-content:center;box-shadow:var(--chart-panel-shadow)}.final-chart-container{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0}.final-chart-image{max-width:100%;max-height:100%;object-fit:contain;animation:scaleIn .8s cubic-bezier(.16,1,.3,1) forwards}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.step-image-container{width:100%;height:100%;position:absolute;top:0;left:0;overflow:hidden}.step-image{width:100%;height:100%;object-fit:cover;animation:fadeInScale 1.2s cubic-bezier(.16,1,.3,1) forwards}@keyframes fadeInScale{0%{opacity:0;transform:scale(1.1)}to{opacity:1;transform:scale(1)}}@media(max-width:768px){body{align-items:flex-start;padding:0}.split-screen-container{width:100%;max-width:100%;height:auto;min-height:100svh;flex-direction:column;border-radius:0;box-shadow:none;border:none}.left-panel{width:100%;padding:28px 20px 32px;flex:1;display:flex;flex-direction:column;align-items:stretch}.right-panel{display:none}.step-6.split-screen-container{flex-direction:column}.step-6 .right-panel{display:flex;order:1;width:100%;padding:0;flex:none}.step-6 .left-panel{order:2;flex:none;padding:24px 20px 32px}.step-6 .graphic-canvas{border-radius:0;min-height:420px;height:auto}.step-6 .final-chart-container{min-height:420px;padding:8px 0 0}.moon-progress-container{margin-bottom:24px}}@media(max-width:400px){.left-panel{padding:20px 16px 28px}.step-6 .graphic-canvas{min-height:360px}}.moon-progress-container{display:flex;align-items:center;justify-content:center;margin-bottom:40px;gap:12px}.moon-indicator{width:32px;height:32px;display:flex;align-items:center;justify-content:center;transition:all .4s cubic-bezier(.16,1,.3,1);cursor:default;opacity:.1}.moon-indicator.active,.moon-indicator.past{opacity:1}.moon-icon{width:24px;height:24px;border-radius:50%;border:1px solid rgba(255,255,255,.15);position:relative;overflow:hidden;background:#ffffff08;transition:all .4s ease}.moon-icon:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:#fff6;border-radius:50%;transition:all .4s cubic-bezier(.4,0,.2,1);transform:translate(-100%)}.moon-icon.new:before{transform:translate(-100%)}.moon-icon.waxing-crescent:before{transform:translate(-65%);background:#fff6}.moon-icon.first-quarter:before{transform:translate(-35%);background:#ffffff80}.moon-icon.waxing-gibbous:before{transform:translate(-15%);background:#fff9}.moon-icon.full{background:#ffffffbf;box-shadow:0 0 15px #ffffff4d}.moon-icon.full:before{transform:translate(0);background:#ffffffe6}.moon-indicator.active{transform:scale(1.15)}.moon-indicator.active .moon-icon{border-color:var(--text-primary);box-shadow:0 0 25px #b59fff4d}.moon-indicator.active .moon-icon:before{background:var(--text-primary);box-shadow:0 0 15px #b59fff80}.moon-indicator.active .moon-icon.full{background:var(--text-primary);box-shadow:0 0 50px #b59fffe6;animation:sunPulse 2s infinite ease-in-out}@keyframes sunPulse{0%{box-shadow:0 0 25px #b59fff66;transform:scale(1)}50%{box-shadow:0 0 65px #b59ffff2;transform:scale(1.1)}to{box-shadow:0 0 25px #b59fff66;transform:scale(1)}}.moon-indicator.past .moon-icon{border-color:#ffffff40;opacity:.6}.moon-indicator.past .moon-icon:before{background:#ffffff73}.progress-line{height:1px;flex:0 0 32px;background-color:var(--input-border);transition:all .4s ease;opacity:.1}.progress-line.filled{background-color:var(--text-primary);opacity:.8}@media(prefers-color-scheme:light){.moon-indicator{opacity:.35}.moon-icon{border:1px solid rgba(45,27,105,.3);background:#e6dcff66}.moon-icon:before{background:#2d1b6980}.moon-icon.waxing-crescent:before{background:#2d1b6980}.moon-icon.first-quarter:before{background:#2d1b6999}.moon-icon.waxing-gibbous:before{background:#2d1b69a6}.moon-icon.full{background:#2d1b69a6;box-shadow:0 0 12px #2d1b6933}.moon-icon.full:before{background:#2d1b69d9}.moon-indicator.active .moon-icon{border-color:#2d1b698c;box-shadow:0 0 20px #2d1b6933}.moon-indicator.active .moon-icon:before{background:#2d1b69bf;box-shadow:none}.moon-indicator.active .moon-icon.full{background:#2d1b69bf;box-shadow:0 0 30px #2d1b6959;animation:moonPulseLight 2s infinite ease-in-out}.moon-indicator.past .moon-icon{border-color:#2d1b6933;opacity:.75}.moon-indicator.past .moon-icon:before{background:#2d1b6973}.progress-line{background-color:#2d1b6940;opacity:.7}.progress-line.filled{background-color:#2d1b6999;opacity:1}}@keyframes moonPulseLight{0%{box-shadow:0 0 18px #2d1b6940;transform:scale(1)}50%{box-shadow:0 0 40px #2d1b698c;transform:scale(1.1)}to{box-shadow:0 0 18px #2d1b6940;transform:scale(1)}}.step-form-group{margin-bottom:24px}.step-row{display:flex;gap:16px;margin-bottom:16px}.step-label{display:block;font-size:14px;font-weight:500;margin-bottom:8px;color:var(--text-primary)}.step-input,.step-select{width:100%;background-color:var(--input-bg);border:1px solid var(--input-bg);border-radius:var(--border-radius-md);padding:14px 16px;font-size:16px;color:var(--text-primary);outline:none;transition:border-color .2s}.step-input:focus,.step-select:focus{border-color:var(--ring-color)}.step-select{appearance:none;background-image:var(--select-arrow-url);background-repeat:no-repeat;background-position:right 16px center;background-size:16px;padding-right:40px}.step-helper-text{font-size:14px;color:var(--text-secondary);line-height:1.5;margin-top:16px}.step-link{display:block;text-align:center;color:var(--primary-color);font-size:14px;text-decoration:none;margin-top:16px;cursor:pointer}.step-link:hover{text-decoration:underline}.autocomplete-dropdown{position:absolute;top:calc(100% + 8px);left:0;width:100%;background-color:var(--input-bg);border:1px solid var(--input-border);border-radius:var(--border-radius-md);max-height:200px;overflow-y:auto;z-index:50;list-style:none;box-shadow:var(--autocomplete-shadow)}.autocomplete-item{padding:12px 16px;cursor:pointer;display:flex;align-items:center;font-size:14px;color:var(--text-primary);border-bottom:1px solid var(--autocomplete-item-border);transition:background-color .2s}.autocomplete-item:last-child{border-bottom:none}.autocomplete-item:hover{background-color:var(--autocomplete-hover)}.step-input.error,.step-select.error{border-color:#ff4d4f!important;background-color:#ff4d4f0d!important}.step-input.error:focus,.step-select.error:focus{box-shadow:0 0 0 2px #ff4d4f33}.step-animate-content,.step-animate-content .step-input,.step-animate-content .step-select,.step-animate-content .continue-button{width:100%;max-width:none}@media(max-width:768px){.step-animate-content{width:100%!important;max-width:none!important;display:flex;flex-direction:column;align-items:stretch}.step-animate-content>div,.step-animate-content>form,.step-animate-content .step-form-group{width:100%!important;max-width:100%!important;min-width:0;flex:1 0 auto}.step-row{display:flex;flex-wrap:nowrap;width:100%!important;max-width:none!important;gap:12px;align-items:stretch}.step-row>div{flex:1;min-width:0}.step-form-group,.step-input,.step-select,.step-animate-content input.step-input,.step-animate-content select.step-select{width:100%!important;max-width:100%!important;box-sizing:border-box}.step-input,.step-select{padding:12px!important;font-size:16px!important}.step-select{padding-right:24px!important;background-position:right 8px center!important}}.birthday-step-row{width:100%;max-width:none}.birthday-step-col{min-width:0}.birthday-step-col-month{flex:2}.birthday-step-col-day{flex:1}.birthday-step-col-year{flex:1.5}@media(max-width:768px){.birthday-step-row{display:flex;flex-wrap:nowrap;width:100%;max-width:none;gap:12px}.birthday-step-col{min-width:0}.birthday-step-col-month{flex:1.2}.birthday-step-col-day,.birthday-step-col-year{flex:1}}.loading-step-container{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;max-width:none;height:100%;padding-top:40px}.circular-progress-wrapper{position:relative;display:flex;align-items:center;justify-content:center;width:100%;margin-bottom:48px}.progress-circle{transition:stroke-dashoffset .1s linear;transform-origin:center;transform:rotate(-90deg)}.progress-text{position:absolute;font-size:24px;font-weight:600;color:var(--text-primary)}.loading-stages{width:100%;max-width:420px;display:flex;flex-direction:column;gap:16px}.stage-item{display:flex;align-items:center;gap:12px;font-size:14px;color:var(--text-secondary);transition:color .3s}.stage-item.active{color:var(--text-primary)}.stage-dot{width:8px;height:8px;border-radius:50%;background-color:var(--input-border);flex-shrink:0;margin:0 4px}.stage-icon{flex-shrink:0}.text-highlight{font-weight:500;color:var(--text-primary)}@media(max-width:768px){.loading-step-container{width:100%;max-width:none;align-items:stretch;padding-top:24px}.circular-progress-wrapper{width:100%;margin-bottom:36px}.loading-stages{width:100%;max-width:none;padding:0 8px}}
