*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{height:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{height:100%;font-family:var(--font-body);color:var(--nebel-text);background:var(--nebel-bg);line-height:1.6;overflow-x:hidden}#root{height:100%}a{color:var(--nebel-accent);text-decoration:none}button{font-family:inherit;cursor:pointer}select{font-family:inherit}::selection{background:var(--nebel-accent-dim);color:var(--nebel-text)}:root{--nebel-bg: #0a0e17;--nebel-bg-light: #111623;--nebel-surface: #181d2e;--nebel-border: #242940;--nebel-text: #e8e0d8;--nebel-text-muted: #7a7486;--nebel-text-dim: #4a4656;--nebel-accent: #9b8ec4;--nebel-accent-bright: #b8aed8;--nebel-accent-dim: rgba(155, 142, 196, .12);--nebel-glow: rgba(155, 142, 196, .35);--element-wood: #5a8a65;--element-fire: #c4685a;--element-earth: #b89a5d;--element-metal: #8a8a96;--element-water: #5a7a9a;--font-body: "Segoe UI", system-ui, -apple-system, sans-serif;--font-display: Georgia, "Noto Serif", "Times New Roman", serif;--ease-gentle: cubic-bezier(.4, 0, .2, 1);--ease-fog: cubic-bezier(.25, .1, .25, 1)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-in-up{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes fog-drift-1{0%,to{transform:translate(0) scale(1)}33%{transform:translate(60px,-40px) scale(1.2)}66%{transform:translate(-30px,20px) scale(.9)}}@keyframes fog-drift-2{0%,to{transform:translate(0) scale(1.05)}50%{transform:translate(-50px,30px) scale(.9)}}@keyframes fog-drift-3{0%,to{transform:translate(10px,-10px) scale(.95)}50%{transform:translate(-20px,20px) scale(1.1)}}@keyframes pulse-point{0%,to{transform:translate(-50%,-50%) scale(1);opacity:.6}50%{transform:translate(-50%,-50%) scale(1.3);opacity:1}}@keyframes pulse-center{0%,to{transform:translate(-50%,-50%) scale(1);box-shadow:0 0 6px var(--nebel-text)}50%{transform:translate(-50%,-50%) scale(1.15);box-shadow:0 0 14px var(--nebel-text),0 0 28px #e8e0d826}}@keyframes breathe{0%,to{opacity:.3}50%{opacity:.7}}.nebel-fog{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0}.nebel-fog:before,.nebel-fog:after{content:"";position:absolute;border-radius:50%;filter:blur(80px)}.nebel-fog:before{width:500px;height:500px;top:-150px;left:-100px;background:radial-gradient(circle,rgba(40,35,65,.5),transparent 70%);animation:fog-drift-1 25s var(--ease-fog) infinite}.nebel-fog:after{width:450px;height:450px;bottom:-100px;right:-80px;background:radial-gradient(circle,rgba(30,40,60,.4),transparent 70%);animation:fog-drift-2 30s var(--ease-fog) infinite}.nebel-fog-layer{position:absolute;width:350px;height:350px;top:40%;left:50%;margin-left:-175px;margin-top:-175px;border-radius:50%;background:radial-gradient(circle,rgba(50,45,75,.35),transparent 70%);filter:blur(60px);animation:fog-drift-3 22s var(--ease-fog) infinite}.page{position:relative;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:1}.welcome{position:relative;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;z-index:1;padding:2rem;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.welcome-content{text-align:center;position:relative;z-index:1}.welcome-title{font-family:var(--font-display);font-size:clamp(3rem,10vw,5rem);font-weight:400;letter-spacing:.15em;color:var(--nebel-text);opacity:0;transition:opacity 1.5s var(--ease-gentle)}.welcome-title.visible{opacity:1}.welcome-tagline{font-size:clamp(1rem,3vw,1.25rem);color:var(--nebel-text-muted);margin-top:1.5rem;font-weight:300;letter-spacing:.05em;opacity:0;transition:opacity 1.5s var(--ease-gentle)}.welcome-tagline.visible{opacity:1}.welcome-subtitle{font-size:clamp(.8rem,2.5vw,.95rem);color:var(--nebel-text-dim);margin-top:.75rem;font-weight:300;font-style:italic;opacity:0;transition:opacity 1.5s var(--ease-gentle)}.welcome-subtitle.visible{opacity:1}.welcome-continue{width:4px;height:4px;border-radius:50%;background:var(--nebel-text-muted);margin-top:3rem;opacity:0;transition:opacity 1.5s var(--ease-gentle);animation:breathe 3s var(--ease-gentle) infinite}.welcome-continue.visible{opacity:1}.onboarding{padding:2rem}.onboarding-content{position:relative;z-index:1;text-align:center;max-width:400px;width:100%}.onboarding-title{font-family:var(--font-display);font-size:1.5rem;font-weight:400;color:var(--nebel-text);font-style:italic;margin-bottom:2rem;animation:fade-in-up 1s var(--ease-gentle) both}.onboarding-subtitle{font-size:.9rem;color:var(--nebel-text-muted);margin-bottom:1.5rem;animation:fade-in-up 1s var(--ease-gentle) .2s both}.date-row{display:flex;gap:.75rem;justify-content:center;margin-bottom:1.5rem;animation:fade-in-up 1s var(--ease-gentle) .4s both}.date-field{display:flex;flex-direction:column;align-items:center;gap:.35rem}.date-field select{appearance:none;-webkit-appearance:none;background:var(--nebel-surface);border:1px solid var(--nebel-border);color:var(--nebel-text);padding:.65rem .5rem;border-radius:8px;font-size:1rem;text-align:center;transition:border-color .3s var(--ease-gentle);cursor:pointer}.date-field select:focus{outline:none;border-color:var(--nebel-accent)}.date-field-day select,.date-field-month select{width:68px}.date-field-year select{width:88px}.date-field-label{font-size:.65rem;color:var(--nebel-text-dim);text-transform:uppercase;letter-spacing:.12em}.optional-fields{margin-bottom:2rem}.hour-toggle{background:none;border:none;color:var(--nebel-text-muted);font-size:.85rem;padding:.5rem 1rem;transition:color .3s var(--ease-gentle);animation:fade-in 1s var(--ease-gentle) .6s both}.hour-toggle:hover{color:var(--nebel-accent)}.hour-input{margin-bottom:.5rem;animation:fade-in-up .5s var(--ease-gentle)}.hour-input select{appearance:none;-webkit-appearance:none;background:var(--nebel-surface);border:1px solid var(--nebel-border);color:var(--nebel-text);padding:.65rem 1rem;border-radius:8px;font-size:1rem;text-align:center;width:120px;cursor:pointer;transition:border-color .3s var(--ease-gentle)}.hour-input select:focus{outline:none;border-color:var(--nebel-accent)}.hour-hint{display:block;font-size:.75rem;color:var(--nebel-text-dim);margin-top:.5rem;font-style:italic}.nebel-button{background:transparent;border:1px solid var(--nebel-accent);color:var(--nebel-accent);padding:.75rem 2.5rem;border-radius:30px;font-size:.95rem;letter-spacing:.05em;transition:all .4s var(--ease-gentle);animation:fade-in-up 1s var(--ease-gentle) .8s both}.nebel-button:hover{background:var(--nebel-accent-dim);box-shadow:0 0 20px var(--nebel-accent-dim)}.nebel-button:active{transform:scale(.97)}.nebel-link{background:none;border:none;color:var(--nebel-text-dim);font-size:.8rem;padding:.5rem 1rem;transition:color .3s var(--ease-gentle)}.nebel-link:hover{color:var(--nebel-text-muted)}.lang-switch{position:fixed;top:1rem;right:1rem;z-index:100;display:flex;gap:2px}.lang-btn{background:transparent;border:none;color:var(--nebel-text-dim);font-size:.65rem;padding:.25rem .35rem;letter-spacing:.06em;transition:color .3s var(--ease-gentle);cursor:pointer}.lang-btn.active{color:var(--nebel-text-muted)}.lang-btn:hover{color:var(--nebel-text)}.profile{justify-content:flex-start;padding:2.5rem 1.5rem 3rem;overflow-y:auto}.profile-content{position:relative;z-index:1;max-width:460px;width:100%}.profile-title{font-family:var(--font-display);font-size:1.4rem;font-weight:400;color:var(--nebel-text);text-align:center;margin-bottom:2rem;animation:fade-in-up .8s var(--ease-gentle) both}.cosmic-card{background:var(--nebel-surface);border:1px solid var(--nebel-border);border-radius:12px;padding:1.25rem 1.5rem;margin-bottom:.75rem;transition:border-color .3s var(--ease-gentle);animation:fade-in-up .8s var(--ease-gentle) both}.cosmic-card:nth-child(2){animation-delay:.1s}.cosmic-card:nth-child(3){animation-delay:.2s}.cosmic-card:nth-child(4){animation-delay:.3s}.cosmic-card:hover{border-color:#9b8ec44d}.cosmic-card h3{font-size:.75rem;color:var(--nebel-accent);text-transform:uppercase;letter-spacing:.12em;margin-bottom:.75rem;font-weight:400}.cosmic-detail{display:flex;justify-content:space-between;align-items:center;padding:.25rem 0}.cosmic-label{font-size:.85rem;color:var(--nebel-text-muted)}.cosmic-value{font-size:.95rem;color:var(--nebel-text)}.elements-label{font-size:.75rem;color:var(--nebel-text-dim);margin-top:.75rem;margin-bottom:.4rem}.elements-bar{display:flex;gap:2px;height:26px;border-radius:6px;overflow:hidden}.element-bar{display:flex;align-items:center;justify-content:center;min-width:0;transition:flex .6s var(--ease-gentle)}.element-bar span{font-size:.55rem;color:#ffffffd9;letter-spacing:.03em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 3px}.element-wood{background:var(--element-wood)}.element-fire{background:var(--element-fire)}.element-earth{background:var(--element-earth)}.element-metal{background:var(--element-metal)}.element-water{background:var(--element-water)}.daeun-timeline{display:flex;gap:4px;margin-top:.6rem;overflow-x:auto;padding-bottom:2px}.daeun-cycle{text-align:center;min-width:42px;padding:.3rem .2rem;border-radius:6px;background:var(--nebel-bg-light)}.daeun-age{font-size:.6rem;color:var(--nebel-text-dim);margin-bottom:.15rem}.daeun-pillar{font-size:.7rem;padding:.15rem 0;border-radius:3px;color:#ffffffe6}.daeun-el-name{font-size:.55rem;color:var(--nebel-text-muted);margin-top:.1rem}.profile-actions{display:flex;flex-direction:column;align-items:center;gap:.75rem;margin-top:2rem}.nebel-map{justify-content:flex-start;padding:0}.map-header{position:relative;z-index:2;display:flex;align-items:center;gap:1rem;padding:1rem 1.5rem;width:100%}.map-back{background:none;border:none;color:var(--nebel-text-muted);font-size:1.2rem;padding:.25rem .5rem;transition:color .3s}.map-back:hover{color:var(--nebel-text)}.map-title{font-size:.8rem;color:var(--nebel-text-dim);letter-spacing:.12em;text-transform:uppercase}.map-canvas{position:relative;flex:1;width:100%;z-index:1}.map-center{position:absolute;z-index:2}.map-center-dot{width:8px;height:8px;border-radius:50%;background:var(--nebel-text);animation:pulse-center 3s var(--ease-gentle) infinite}.fog-point{position:absolute;transform:translate(-50%,-50%);width:var(--size, 12px);height:var(--size, 12px);border-radius:50%;background:var(--nebel-accent);border:none;padding:0;cursor:pointer;opacity:calc(.35 + var(--score, .5) * .65);animation:pulse-point var(--pulse-duration, 3s) var(--ease-gentle) infinite;animation-delay:var(--pulse-delay, 0s);transition:box-shadow .3s}.fog-point:hover,.fog-point.selected{animation:none;opacity:1;transform:translate(-50%,-50%) scale(1.4);box-shadow:0 0 14px var(--nebel-glow),0 0 35px var(--nebel-accent-dim)}.fog-point-place{background:var(--nebel-accent-bright);border-radius:3px}.map-detail{position:fixed;bottom:0;left:0;right:0;z-index:10;background:var(--nebel-bg-light);border-top:1px solid var(--nebel-border);padding:1.25rem 1.5rem;padding-bottom:calc(1.25rem + env(safe-area-inset-bottom,0px));animation:fade-in-up .3s var(--ease-gentle)}.map-detail-score{font-family:var(--font-display);font-size:1.4rem;color:var(--nebel-accent-bright);margin-bottom:.15rem}.map-detail-distance{font-size:.85rem;color:var(--nebel-text-muted)}.map-detail-note{font-size:.85rem;color:var(--nebel-text);font-style:italic;margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--nebel-border)}