body{min-height:100vh;margin:0}#root{min-height:100vh}*{box-sizing:border-box;margin:0;padding:0}:root{--gold:#d4af37;--gold-light:#f4e4a6;--gold-dark:#996515;--purple-deep:#1a0a2e;--purple:#2d1b4e;--purple-light:#4a2c7a;--text:#e8d5b7}body{background:linear-gradient(135deg, var(--purple-deep) 0%, #0d0618 50%, #150a25 100%);min-height:100vh;color:var(--text);font-family:Georgia,serif;overflow-x:hidden}.app{justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex;position:relative}.stars,.stars2,.stars3{pointer-events:none;width:100%;height:100%;position:fixed;top:0;left:0}.stars{background:url(data:image,https://s3-us-west-2.amazonaws.com/s.cdpn.io/123024/stars.png);animation:2s linear infinite starfall}.stars2{background:url(data:image,https://s3-us-west-2.amazonaws.com/s.cdpn.io/123024/stars2.png);animation:3s linear infinite starfall}.stars3{background:url(data:image,https://s3-us-west-2.amazonaws.com/s.cdpn.io/123024/stars3.png);animation:4s linear infinite starfall}@keyframes starfall{0%{transform:translateY(0)}to{transform:translateY(-100px)}}.container{z-index:10;width:95%;min-width:1000px;max-width:1400px}@media (width>=1400px){.container{max-width:1600px}}.title{text-align:center;color:var(--gold);text-shadow:0 0 30px #d4af3780,0 0 60px #d4af374d;letter-spacing:.2em;margin-bottom:5px;font-size:2.5rem;animation:3s ease-in-out infinite glow}@keyframes glow{0%,to{text-shadow:0 0 30px #d4af3780,0 0 60px #d4af374d}50%{text-shadow:0 0 40px #d4af37cc,0 0 80px #d4af3780}}.subtitle{text-align:center;color:#e8d5b7b3;margin-bottom:20px;font-size:1rem;font-style:italic}.input-section{text-align:center}.question-input{border:2px solid var(--gold-dark);width:100%;max-width:600px;color:var(--text);resize:vertical;background:#2d1b4e99;border-radius:10px;min-height:100px;margin:0 auto 30px;padding:20px;font-family:inherit;font-size:1.1rem;transition:all .3s;display:block}.question-input:focus{border-color:var(--gold);outline:none;box-shadow:0 0 20px #d4af374d}.question-input::placeholder{color:#e8d5b766}.draw-btn,.analyze-btn,.reset-btn{cursor:pointer;border:none;border-radius:8px;padding:15px 40px;font-family:inherit;font-size:1.1rem;transition:all .3s}.draw-btn{background:linear-gradient(135deg, var(--gold-dark) 0%, var(--gold) 50%, var(--gold-dark) 100%);color:var(--purple-deep);font-weight:700;box-shadow:0 4px 20px #d4af3766}.draw-btn:hover{transform:translateY(-2px);box-shadow:0 6px 30px #d4af3799}.analyze-btn{background:linear-gradient(135deg, var(--purple-light) 0%, var(--purple) 100%);color:var(--gold);border:2px solid var(--gold);margin-right:15px}.analyze-btn:hover:not(:disabled){background:linear-gradient(135deg, var(--purple) 0%, var(--purple-light) 100%);box-shadow:0 0 20px #d4af3766}.analyze-btn:disabled{opacity:.6;cursor:not-allowed}.reset-btn{color:var(--text);background:0 0;border:1px solid #e8d5b74d}.reset-btn:hover{border-color:var(--gold);color:var(--gold)}.share-btn{background:linear-gradient(135deg, var(--gold) 0%, var(--gold-dark) 100%);color:var(--purple-deep);cursor:pointer;border:none;border-radius:8px;margin-right:15px;padding:15px 40px;font-family:inherit;font-size:1.1rem;font-weight:700;transition:all .3s;box-shadow:0 4px 20px #d4af3766}.share-btn:hover{transform:translateY(-2px);box-shadow:0 6px 30px #d4af3799}.result-section{text-align:center}.cards-container{flex-wrap:wrap;justify-content:center;gap:30px;margin:20px 0;display:flex}.card-wrapper{text-align:center;position:relative}.card{perspective:1000px;cursor:pointer;width:140px;height:210px}.card-inner{width:100%;height:100%;transform-style:preserve-3d;transition:transform .8s;position:relative}.card-front{backface-visibility:hidden;border:3px solid var(--gold);background:linear-gradient(145deg,#1a1a2e 0%,#0d0d1a 100%);border-radius:12px;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;box-shadow:0 10px 40px #00000080,inset 0 0 30px #d4af371a}.card-pattern{background:linear-gradient(145deg,#d4af370d 0%,#0000 100%);border:2px solid #d4af374d;border-radius:8px;justify-content:center;align-items:center;width:100px;height:150px;display:flex}.card-image{object-fit:cover;border-radius:8px;width:100%;height:100%}.card-symbol{color:var(--gold);text-shadow:0 0 20px #d4af3780;font-size:3rem}.card-id{color:var(--gold-dark);letter-spacing:.2em;font-size:.9rem;position:absolute;bottom:10px}.card.reversed .card-inner,.card.reversed .card-front{transform:rotateY(180deg)}.card-name{color:var(--gold);margin-top:15px;font-size:1.3rem;font-weight:700}.reversed-badge{background:var(--purple);color:var(--gold);border:1px solid var(--gold);border-radius:20px;margin-top:8px;padding:4px 12px;font-size:.8rem;display:inline-block}.analysis-box{border:2px solid var(--gold-dark);text-align:left;background:#2d1b4eb3;border-radius:15px;max-width:700px;margin:30px auto;padding:30px}.analysis-box h3{color:var(--gold);text-align:center;margin-bottom:20px;font-size:1.4rem}.analysis-box p{color:var(--text);white-space:pre-wrap;line-height:1.8}.btn-group{margin-top:30px}.selection-section{text-align:center}.selection-section .subtitle{margin-bottom:20px}.fan-container{flex-direction:column;justify-content:flex-end;align-items:center;width:100%;min-width:1200px;height:550px;display:flex;position:relative;overflow:visible}.fan-cards{width:1200px;height:550px;display:block;position:relative}.fan-card{cursor:pointer;transform-origin:bottom;-webkit-user-select:none;user-select:none;width:80px;height:130px;transform:rotate(var(--rotation,0deg));border:1px solid #c9a96e4d;border-radius:6px;transition:box-shadow .3s,filter .3s;position:absolute;overflow:hidden;box-shadow:0 4px 15px #00000080}.fan-card:hover,.fan-card:active{filter:brightness(1.15);transform:rotate(var(--rotation,0deg)) scale(1.08);box-shadow:0 15px 40px #000000b3,0 0 30px #c9a96e66;z-index:200!important}.fan-card.selected{opacity:.4;pointer-events:none}.fan-card.animating{pointer-events:none}.fan-card-inner{background:linear-gradient(145deg,#2a2a4a,#1a1a2e);border-radius:10px;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.fan-card-inner:before{content:"";border:1px solid #c9a96e33;border-radius:8px;position:absolute;inset:3px}.fan-card-back{border:1px solid #c9a96e4d;border-radius:6px;justify-content:center;align-items:center;width:100%;height:100%;display:flex;overflow:hidden;box-shadow:0 4px 15px #00000080}.card-back-image{object-fit:cover;width:100%;height:100%}.fan-card-pattern{background:linear-gradient(145deg,#c9a96e0d 0%,#0000 100%);border:1px solid #c9a96e4d;border-radius:4px;justify-content:center;align-items:center;width:55px;height:85px;display:flex}.fan-card-symbol{color:#c9a96e;text-shadow:0 0 10px #c9a96e80;font-size:1.8rem}.selection-info{flex-direction:column;align-items:center;gap:10px;margin-bottom:15px;display:flex}.selection-info p{color:var(--gold);font-size:1.1rem}.cancel-btn{color:var(--text);cursor:pointer;background:0 0;border:1px solid #e8d5b74d;border-radius:8px;padding:10px 30px;font-family:inherit;font-size:1rem;transition:all .3s}.cancel-btn:hover{border-color:var(--gold);color:var(--gold)}.selected-cards-preview{justify-content:center;gap:40px;margin-top:30px;display:flex}.preview-item{flex-direction:column;align-items:center;gap:10px;display:flex}.preview-slot{border:2px dashed #d4af374d;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;width:100px;height:150px;transition:all .3s;display:flex}.preview-slot.filled{border-style:solid;border-color:var(--gold);background:#d4af371a}.preview-image{object-fit:cover;border-radius:6px;width:100%;height:100%}.preview-name{color:var(--text);text-align:center;font-size:.9rem}.animation-overlay{z-index:2000;pointer-events:none;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:fixed;top:0;left:0}.animating-card{animation:3.5s ease-out forwards cardFloatUp}@keyframes cardFloatUp{0%{opacity:1;transform:scale(1)translateY(0)}40%{opacity:1;transform:scale(1.3)translateY(-80px)}70%{opacity:1;transform:scale(1)translateY(200px)}to{opacity:0;transform:scale(.8)translateY(400px)}}.animating-card-inner{perspective:1000px;width:140px;height:210px}.animating-card-inner .card-front{animation:.8s ease-in-out .3s forwards cardFlip}@keyframes cardFlip{0%{transform:rotateY(0)}to{transform:rotateY(180deg)}}.revealed-overlay{z-index:2000;background:#000000d9;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;animation:.5s fadeIn;display:flex;position:fixed;top:0;left:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.revealed-card{width:180px;height:270px;animation:.8s revealCard}@keyframes revealCard{0%{opacity:0;transform:scale(.5)rotateY(0)}to{opacity:1;transform:scale(1)rotateY(180deg)}}.revealed-card .card-front{width:100%;height:100%}.revealed-card .card-pattern{width:130px;height:190px}.revealed-card .card-symbol{font-size:4rem}.revealed-name{color:var(--gold);text-shadow:0 0 20px #d4af3780;margin-top:30px;font-size:2rem;animation:.5s .5s both fadeIn}.revealed-meaning{color:var(--text);text-align:center;max-width:500px;margin-top:20px;font-size:1rem;line-height:1.6;animation:.5s .7s both fadeIn}@media (width<=600px){.title{letter-spacing:.1em;font-size:2rem}.cards-container{gap:20px}.card{width:100px;height:150px}.card-pattern{width:70px;height:100px}.card-symbol{font-size:2rem}.draw-btn,.analyze-btn,.reset-btn{padding:12px 25px;font-size:1rem}.fan-cards{min-width:1500px;height:250px}.fan-card{width:80px;height:120px}.fan-card-pattern{width:55px;height:80px}.fan-card-symbol{font-size:1.5rem}.fan-card-inner{transform-origin:50% 180px}}.flip-overlay{z-index:2000;background:#000000d9;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;animation:.3s fadeIn;display:flex;position:fixed;top:0;left:0}.flip-card{perspective:1000px;width:200px;height:300px;position:relative}.flip-card-inner{width:100%;height:100%;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.4,0,.2,1);position:relative;transform:rotateY(0)}.flip-card-inner.flipping{transform:rotateY(180deg)}.flip-card-face{backface-visibility:hidden;border-radius:12px;width:100%;height:100%;position:absolute;overflow:hidden;box-shadow:0 8px 32px #0006}.flip-card-face.back{z-index:2}.flip-card-face.back .flip-card-image{z-index:1;position:relative}.flip-card-face.front{z-index:1;transform:rotateY(180deg)}.flip-card-image{object-fit:cover;width:100%;height:100%}.flip-card-name{color:var(--gold);text-shadow:0 0 20px #d4af3780;margin-top:30px;font-size:1.8rem;animation:.5s .5s both fadeIn}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}
