.birth-chart-container{position:relative;width:100%;background-color:#fdfcf0;direction:rtl;display:flex;flex-direction:column}.birth-chart-header{padding:20px;text-align:center;border-bottom:1px solid rgba(0,0,0,.1)}.birth-chart-header h3{margin:0;font-size:1.5rem;color:#1a1a2e;font-family:Frank Ruhl Libre,serif}.birth-chart-header-sub{font-size:.9rem;color:indigo;margin-top:3px}.close-button{position:absolute;top:15px;right:15px;background:#fff;border:1px solid #4b0082;border-radius:50%;width:35px;height:35px;cursor:pointer;z-index:10}.scroll-area{flex:1;padding:20px}.intro-section{max-width:800px;margin:0 auto 30px;text-align:center;font-style:italic;color:indigo;line-height:1.6;font-size:1rem}.simulator-container{max-width:800px;margin:0 auto 30px;padding:20px;background-color:#fff;border-radius:15px;border:1px solid #4b0082;box-shadow:0 4px 15px #0000000d}.simulator-header{font-size:.9rem;font-weight:700;color:indigo;margin-bottom:15px;text-align:center}.simulator-input-grid{display:flex;gap:20px;flex-wrap:wrap;justify-content:center;align-items:flex-end}.input-group{display:flex;flex-direction:column;gap:5px}.input-label{font-size:.8rem;color:#666;font-weight:700}.simulator-input{padding:10px;border-radius:8px;border:1px solid #ccc;font-family:inherit;font-size:1rem}.reset-button{padding:10px 20px;border-radius:30px;border:none;background-color:indigo;color:#fff;font-weight:700;cursor:pointer;font-size:.9rem}.main-display-container{display:flex;justify-content:center;gap:20px;max-width:1400px;margin:0 auto}.wheel-container{flex:0 0 auto;display:flex;justify-content:center;order:2}.side-legend{flex:1;min-width:280px;padding:15px;background-color:#fff6;border-radius:15px;order:1}.side-legend.challenging{order:3}.legend-header{border-bottom:1px solid rgba(0,100,0,.2);padding-bottom:8px;cursor:pointer}.legend-header.harmonic{color:#006400}.legend-header.challenging{color:#8b0000;border-bottom:1px solid rgba(139,0,0,.2)}.legend-item{margin-bottom:12px;padding:8px;border-bottom:1px solid rgba(0,0,0,.05);cursor:pointer}.legend-item-title{font-size:.9rem;font-weight:700}.legend-item-desc{font-size:.8rem;color:#555;margin-top:4px}.interpretation-section{max-width:1000px;margin:40px auto;padding:20px}.interpretation-header{border-bottom:2px solid #4b0082;padding-bottom:10px}.interpretation-grid{display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(400px,1fr))}.interp-card{padding:20px;background-color:#fff;border-radius:15px;border:1px solid rgba(75,0,130,.1);cursor:pointer}.interp-card-title{font-weight:700;color:indigo;margin-bottom:8px}.interp-card p{font-size:.95rem;margin:0;color:#1a1a2e;line-height:1.5}.summary-section{margin-top:30px;padding:30px;border-top:2px solid #4b0082;background-color:#4b008208;border-radius:15px}.summary-text{color:#1a1a2e;line-height:1.6;font-size:1.1rem;font-weight:500}@media (max-width: 900px){.birth-chart-header{padding:10px}.birth-chart-header h3{font-size:1.1rem}.birth-chart-header-sub{font-size:.8rem}.scroll-area{padding:10px}.intro-section{font-size:.9rem;margin-bottom:20px}.simulator-container{padding:15px}.simulator-input-grid{gap:10px}.simulator-input{padding:8px}.reset-button{padding:8px 15px;font-size:.8rem}.main-display-container{flex-direction:column}.wheel-container{order:1}.side-legend{order:2}.side-legend.challenging{order:3}.interpretation-grid{grid-template-columns:1fr}}.tutorial-overlay-container{position:fixed;top:0;left:0;width:100%;height:100%;z-index:20000;pointer-events:auto;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;padding-bottom:90px}.tutorial-backdrop{display:none}.tutorial-content{display:flex;flex-direction:row;align-items:flex-end;max-width:600px;width:90%;margin-bottom:20px;pointer-events:auto;position:relative}.tutorial-character{height:250px;object-fit:contain;filter:drop-shadow(0 0 15px rgba(255,215,0,.4));transition:transform var(--transition-normal);z-index:2}.tutorial-bubble{background:radial-gradient(circle at top right,#2d2d50eb,#0f0f1efa);backdrop-filter:blur(20px) saturate(180%);border:1px solid rgba(255,215,0,.4);border-radius:24px 24px 0;padding:24px;margin-left:0;margin-right:-40px;margin-bottom:40px;color:var(--color-text);direction:rtl;box-shadow:0 25px 50px #000c,0 0 30px #ffd70026,inset 0 0 15px #ffffff0d;position:relative;z-index:10;flex:1;min-width:200px}.step-intro .tutorial-content{flex-direction:column-reverse;align-items:center;justify-content:center;max-width:800px;padding-bottom:20px}.step-intro .tutorial-character{height:500px;margin-top:-20px}.step-intro .tutorial-bubble{margin-right:0;margin-bottom:10px;border-radius:24px 24px 24px 4px;width:100%;max-width:600px}.step-clock .tutorial-character,.step-zodiac .tutorial-character,.step-info .tutorial-character{height:350px;margin-right:-20px}#earth-indicator{filter:drop-shadow(0 0 10px #4169E1)}.step-info #earth-indicator{animation:click-earth-pulse 1.5s infinite}@keyframes click-earth-pulse{0%{filter:drop-shadow(0 0 5px rgba(65,105,225,.6));transform:scale(1) translate(0)}50%{filter:drop-shadow(0 0 25px rgba(65,105,225,1));transform:scale(1.1) translate(0)}to{filter:drop-shadow(0 0 5px rgba(65,105,225,.6));transform:scale(1) translate(0)}}.tutorial-hand{position:fixed;top:var(--hand-y, 50%);left:var(--hand-x, 50%);width:60px;height:60px;z-index:30000;pointer-events:none;display:none;opacity:0;margin-left:-29px;margin-top:-18px;filter:drop-shadow(0 0 10px rgba(255,215,0,.7));transform-origin:top left}.tutorial-hand-portal-wrapper{position:fixed;top:0;left:0;width:0;height:0;pointer-events:none;z-index:30000}.tutorial-hand-portal-wrapper.step-info .tutorial-hand{display:block;animation:hand-click-flow 7s forwards ease-in-out}.step-creation.tutorial-overlay-container{justify-content:flex-start;padding-top:60px;align-items:flex-start}.step-creation .tutorial-content{flex-direction:column-reverse;align-items:flex-start;justify-content:flex-start;max-width:100%;width:100%;padding-right:0;margin-bottom:0}.step-creation .tutorial-character{height:70vh;margin-top:-80px;align-self:flex-start;margin-right:-20px}.step-creation .tutorial-bubble{margin-right:20px;margin-bottom:20px;width:auto;max-width:450px;border-radius:24px 24px 4px}.tutorial-hand-portal-wrapper.step-creation .tutorial-hand{display:block;animation:hand-creation-flow 9s forwards ease-in-out;animation-delay:2s;transform-origin:29px 18px}@keyframes hand-creation-flow{0%{transform:translate(-30vw,-40vh) rotate(165deg);opacity:0}20%{transform:translate(0) rotate(180deg);opacity:1}24%{transform:translate(0) rotate(180deg) scale(.8);opacity:1}28%{transform:translate(0) rotate(180deg) scale(1);opacity:1}78%{transform:translate(0) rotate(180deg) scale(1);opacity:1}82%{transform:translate(0) rotate(180deg) scale(.8);opacity:1}86%{transform:translate(0) rotate(180deg) scale(1);opacity:1}95%{transform:translate(-30vw,-40vh) rotate(165deg);opacity:0}to{opacity:0}}#cosmic-header{transition:filter .3s ease}.step-creation #cosmic-header{animation:creation-pulse 1.5s infinite}@keyframes creation-pulse{0%{filter:drop-shadow(0 0 5px rgba(168,85,247,.4))}50%{filter:drop-shadow(0 0 20px rgba(168,85,247,.8))}to{filter:drop-shadow(0 0 5px rgba(168,85,247,.4))}}@keyframes hand-click-flow{0%{transform:translate(40vw,60vh) rotate(-15deg);opacity:0}20%{transform:translate(0) rotate(0);opacity:1}24%{transform:translate(0) scale(.8);opacity:1}28%{transform:translate(0) scale(1);opacity:1}72%{transform:translate(0) scale(1);opacity:1}76%{transform:translate(0) scale(.8);opacity:1}80%{transform:translate(0) scale(1);opacity:1}95%{transform:translate(40vw,60vh);opacity:0}to{opacity:0}}.tutorial-text{margin:0 0 15px;font-size:1.1rem;line-height:1.5;font-family:var(--font-primary);white-space:pre-wrap}.tutorial-nav{display:flex;gap:10px;justify-content:flex-end}.tutorial-btn-skip{background:transparent;border:none;color:var(--color-text-muted);cursor:pointer;font-size:.9rem;margin-left:auto;font-family:var(--font-primary)}.tutorial-btn-nav{padding:8px 20px;border-radius:12px;border:1px solid rgba(255,215,0,.5);background:#ffd70026;color:var(--color-gold);cursor:pointer;font-size:.9rem;font-family:var(--font-primary);transition:all var(--transition-fast);backdrop-filter:blur(5px)}.tutorial-btn-nav:hover{background:#ffd70040;border-color:var(--color-gold);transform:translateY(-1px)}.tutorial-btn-finish{background:var(--gradient-gold);color:#000;font-weight:700;border:none;box-shadow:0 4px 15px #ffd7004d}.tutorial-btn-finish:hover{box-shadow:0 6px 20px #ffd70080;transform:translateY(-2px)}.tutorial-restart-btn{position:fixed;top:10%;right:20px;z-index:10000;background:#ffd7001a;border:1px solid rgba(255,215,0,.3);border-radius:50%;width:36px;height:36px;color:var(--color-gold);font-size:1.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px #0000004d;transition:all var(--transition-fast)}.tutorial-restart-btn:hover{background:#ffd70033;border-color:var(--color-gold)}@media (max-width: 600px){.tutorial-overlay-container{padding-bottom:80px}.tutorial-content{width:95%;margin-bottom:10px}.tutorial-character{height:180px;max-width:40%}.step-intro .tutorial-character{height:300px;max-width:80%;margin-top:-10px}.step-intro .tutorial-bubble{max-width:90%;font-size:1.1rem;padding:18px;margin-bottom:15px}.step-clock .tutorial-character,.step-zodiac .tutorial-character,.step-info .tutorial-character,.step-creation .tutorial-character{height:240px;max-width:60%}.step-creation .tutorial-character{height:50vh;max-width:80%}.step-creation .tutorial-bubble{max-width:90%;margin-right:15px}.tutorial-bubble{padding:15px;margin-right:-30px;margin-bottom:30px;min-width:150px}.tutorial-text{font-size:.95rem;line-height:1.4}.tutorial-btn-nav{padding:6px 12px;font-size:.85rem}.tutorial-btn-skip{font-size:.8rem}}@media (max-height: 800px){.step-intro .tutorial-character{height:350px}.step-intro .tutorial-bubble{font-size:1.1rem;max-width:450px}}@media (max-height: 600px){.step-intro .tutorial-character{height:250px}}@media (max-height: 700px){.tutorial-character{height:150px}.tutorial-bubble{margin-bottom:20px}}