.tarot-widget{max-width:100%;margin:3rem auto;padding:30px 20px;border-radius:20px;box-shadow:0 20px 40px rgba(0,0,0,.3);color:#e8f5e8;position:relative;overflow:hidden;background:linear-gradient(135deg,#9293f0 0,#9293f0 50%,#9293f0 100%)}#nh-bnr{background-size:41.5% 100%!important}#nonhome{border-bottom:22px solid #f0f}.tarot-widget::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="stars" patternUnits="userSpaceOnUse" width="100" height="100"><circle cx="20" cy="20" r="1" fill="%23ffffff" opacity="0.1"/><circle cx="80" cy="40" r="1.5" fill="%23ffffff" opacity="0.15"/><circle cx="40" cy="70" r="1" fill="%23ffffff" opacity="0.1"/><circle cx="90" cy="90" r="1" fill="%23ffffff" opacity="0.12"/><circle cx="10" cy="60" r="1.2" fill="%23ffffff" opacity="0.08"/></pattern></defs><rect width="100" height="100" fill="url(%23stars)"/></svg>') repeat;pointer-events:none}.widget-header{text-align:center;margin:3rem 0;position:relative;z-index:1}.widget-title{font-size:2.5rem;font-weight:600;margin-bottom:10px;background:linear-gradient(45deg,#4ecdc4,#7fcdcd,#4ecdc4);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:0 2px 4px rgba(0,0,0,.3)}.widget-subtitle{font-size:1.2rem;opacity:.9;font-style:italic;margin-bottom:10px;color:#e8f5e8}.instructions{font-size:1rem;opacity:.8;margin-bottom:10px}.selection-counter{font-size:1.1rem;font-weight:600;color:#4ecdc4;margin-bottom:20px;background:linear-gradient(45deg,#4ecdc4,#7fcdcd,#4ecdc4);background-clip:border-box;background-clip:border-box;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:0 2px 4px rgba(0,0,0,.3)}.cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:15px;margin:40px 0;position:relative;z-index:1;max-width:100%;margin-left:auto;margin-right:auto}.card{width:120px;perspective:1000px;cursor:pointer;transition:all .3s ease;position:relative}.card-container{width:120px;height:180px;position:relative}.card:hover{transform:scale(1.05) translateY(-5px)}.card.selected{transform:scale(1.1) translateY(-10px)}.card.disabled{opacity:.5;cursor:not-allowed}.card.disabled:hover{transform:none}.card-inner{position:relative;width:88%;height:100%;text-align:center;transition:transform .8s cubic-bezier(.4,0,.2,1);transform-style:preserve-3d;border-radius:12px}.selected-card.floating.info-revealed .card-inner{width:100%}.card-face{position:absolute;width:100%;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:12px;display:flex;justify-content:center;align-items:center;overflow:hidden;top:0}.card-front{background:linear-gradient(135deg,#e8f5e8,#f0f8f0);color:#2c5364;transform:rotateY(180deg)}.card-image{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border-radius:6px}.card-image-placeholder{width:100%;height:100%;background:linear-gradient(135deg,#2c5364,#1a4454);border-radius:6px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(44,83,100,.3);font-size:2rem;color:#4ecdc4}.card-back{background:url(../images/tarot-card-image/card-bg.jpg) no-repeat;background-position:center;background-size:auto;position:relative;background-size:contain;justify-content:center;align-items:center}.card.selected .card-back{border-color:#feca57;box-shadow:0 0 20px rgba(254,202,87,.5)}.card.selected .card-back::after{border-color:#feca57;opacity:.8}.selection-indicator{position:absolute;top:5px;right:5px;width:20px;height:20px;background:#feca57;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700;color:#2c5364;opacity:0;transform:scale(0);transition:all .3s ease;z-index:999}.card.selected .selection-indicator{opacity:1;transform:scale(1)}.card.flipped .card-inner{transform:rotateY(180deg)}.selected-cards-display{display:flex;justify-content:center;gap:20px;margin:30px 0;flex-wrap:wrap;position:relative;z-index:1}.selected-card{perspective:1000px;display:flex;flex-direction:column;align-items:center}.selected-card-container{width:16rem;height:28rem;position:relative}.selected-card .card-info{margin-top:15px;width:16rem;perspective:1000px;opacity:0;transform:rotateX(-90deg);transition:all .8s cubic-bezier(.4,0,.2,1)}.selected-card.info-revealed .card-info{opacity:1;transform:rotateX(0);background:#fff;border-radius:.7rem;padding:.9rem;position:relative;overflow:hidden}.selected-card.info-revealed .card-info::after{content:'';position:absolute;inset:0;border-radius:.7rem;padding:4px;background:linear-gradient(145deg,#e3c567,#f9f0c4);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:add,add;-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.selected-card .card-name{font-size:1.2rem;margin-bottom:10px;color:#e8f5e8;transform:translateY(10px);opacity:0;transition:all .6s ease .3s}.selected-card .card-meaning{font-size:1rem;opacity:0;color:#e8f5e8;transform:translateY(15px);transition:all .6s ease .5s}.selected-card.info-revealed .card-name{opacity:1;transform:translateY(0);font-family:var(--secFont);text-align:center;color:#000}.selected-card.info-revealed .card-meaning{opacity:.9;transform:translateY(0);font-family:var(--secFont);color:var(--textColor);text-align:center}.controls{text-align:center;margin-bottom:30px;position:relative;z-index:1}.reveal-button,.shuffle-button,.start-button{background:linear-gradient(135deg,#4ecdc4,#44a08d);border:none;color:#fff;padding:15px 30px;font-size:1.1rem;font-weight:600;border-radius:50px;cursor:pointer;transition:all .3s ease;box-shadow:0 6px 20px rgba(78,205,196,.3);margin:0 10px;position:relative;overflow:hidden}.reveal-button:hover,.shuffle-button:hover,.start-button:hover{transform:translateY(-3px);box-shadow:0 8px 25px rgba(78,205,196,.4)}.reveal-button:active,.shuffle-button:active,.start-button:active{transform:translateY(-1px)}.reveal-button:disabled{background:linear-gradient(135deg,#666,#888);cursor:not-allowed;opacity:.6}.reveal-button:disabled:hover{transform:none;box-shadow:0 6px 20px rgba(78,205,196,.3)}.reveal-button::before,.shuffle-button::before,.start-button::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.reveal-button:hover::before,.shuffle-button:hover::before,.start-button:hover::before{left:100%}.result{text-align:center;margin-top:30px;opacity:0;transform:translateY(20px);transition:all .5s ease;position:relative;z-index:1}.result.show{opacity:1;transform:translateY(0);background:var(--whiteColor);width:60%;margin:0 auto;padding:2rem 0;border-radius:.5rem;position:relative}.result.show::after{content:'';position:absolute;inset:0;border-radius:.7rem;padding:4px;background:linear-gradient(145deg,#e3c567,#f9f0c4);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:source-over,source-over;mask-composite:add,add;mask-composite:add,add;-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.result-answer{font-size:3rem;font-weight:600;margin-bottom:15px;text-shadow:0 3px 6px rgba(0,0,0,.3)}.result-answer.yes{color:#4ecdc4}.result-answer.no{color:#ff6b6b}.result-answer.maybe{color:#feca57}.result-explanation{opacity:.9;max-width:600px;margin:0 auto;line-height:1.6;color:var(--textColor)}.shuffling{-webkit-animation:shuffle .6s ease-in-out;animation:shuffle .6s ease-in-out}@-webkit-keyframes shuffle{0%,100%{transform:translateX(0) rotate(0)}25%{transform:translateX(-5px) rotate(-2deg)}75%{transform:translateX(5px) rotate(2deg)}}@keyframes shuffle{0%,100%{transform:translateX(0) rotate(0)}25%{transform:translateX(-5px) rotate(-2deg)}75%{transform:translateX(5px) rotate(2deg)}}.shuffle-container{position:relative;height:300px;width:100%;display:flex;align-items:center;justify-content:center;overflow:hidden}.shuffle-card{position:absolute;width:70px;height:110px;background:url(../images/tarot-card-image/card-bg.jpg) no-repeat;background-position:center;background-size:auto;background-size:contain;border-radius:10px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 15px rgba(0,0,0,.6);opacity:0;transform-origin:center center}.shuffle-card::before{content:'🌟';font-size:1.5rem;opacity:.4;transform:rotate(45deg)}.shuffle-card.flourish{-webkit-animation:flourishShuffle 3.5s ease-in-out forwards;animation:flourishShuffle 3.5s ease-in-out forwards}@-webkit-keyframes flourishShuffle{0%{opacity:0;transform:translateX(0) translateY(0) rotate(0) scale(.3)}5%{opacity:1;transform:translateX(0) translateY(0) rotate(0) scale(.5)}15%{opacity:1;transform:translateX(var(--spread-x)) translateY(var(--spread-y)) rotate(var(--spread-rotation)) scale(1)}20%{transform:translateX(calc(var(--spread-x) * 1.2)) translateY(calc(var(--spread-y) * 1.2)) rotate(calc(var(--spread-rotation) * 1.5)) scale(1.1)}25%{transform:translateX(var(--spiral-x-1)) translateY(var(--spiral-y-1)) rotate(calc(var(--spread-rotation) + 180deg)) scale(1)}35%{transform:translateX(var(--spiral-x-2)) translateY(var(--spiral-y-2)) rotate(calc(var(--spread-rotation) + 360deg)) scale(.9)}45%{transform:translateX(var(--spiral-x-3)) translateY(var(--spiral-y-3)) rotate(calc(var(--spread-rotation) + 540deg)) scale(1.1)}50%{transform:translateX(var(--spiral-x-4)) translateY(var(--spiral-y-4)) rotate(calc(var(--spread-rotation) + 720deg)) scale(1)}60%{transform:translateX(calc(var(--spiral-x-4) * .6)) translateY(calc(var(--spiral-y-4) * .6)) rotate(calc(var(--spread-rotation) + 900deg)) scale(.95)}70%{transform:translateX(calc(var(--spiral-x-4) * .3)) translateY(calc(var(--spiral-y-4) * .3)) rotate(calc(var(--spread-rotation) + 1080deg)) scale(1.05)}75%{transform:translateX(0) translateY(0) rotate(calc(var(--spread-rotation) + 1260deg)) scale(1)}85%{transform:translateX(0) translateY(0) rotate(calc(var(--spread-rotation) + 1440deg)) scale(1.1);opacity:1}90%{transform:translateX(0) translateY(0) rotate(calc(var(--spread-rotation) + 1440deg)) scale(1);opacity:.8}95%{opacity:.5;transform:translateX(0) translateY(0) rotate(calc(var(--spread-rotation) + 1440deg)) scale(.9)}100%{opacity:0;transform:translateX(0) translateY(0) rotate(calc(var(--spread-rotation) + 1440deg)) scale(.8)}}@keyframes flourishShuffle{0%{opacity:0;transform:translateX(0) translateY(0) rotate(0) scale(.3)}5%{opacity:1;transform:translateX(0) translateY(0) rotate(0) scale(.5)}15%{opacity:1;transform:translateX(var(--spread-x)) translateY(var(--spread-y)) rotate(var(--spread-rotation)) scale(1)}20%{transform:translateX(calc(var(--spread-x) * 1.2)) translateY(calc(var(--spread-y) * 1.2)) rotate(calc(var(--spread-rotation) * 1.5)) scale(1.1)}25%{transform:translateX(var(--spiral-x-1)) translateY(var(--spiral-y-1)) rotate(calc(var(--spread-rotation) + 180deg)) scale(1)}35%{transform:translateX(var(--spiral-x-2)) translateY(var(--spiral-y-2)) rotate(calc(var(--spread-rotation) + 360deg)) scale(.9)}45%{transform:translateX(var(--spiral-x-3)) translateY(var(--spiral-y-3)) rotate(calc(var(--spread-rotation) + 540deg)) scale(1.1)}50%{transform:translateX(var(--spiral-x-4)) translateY(var(--spiral-y-4)) rotate(calc(var(--spread-rotation) + 720deg)) scale(1)}60%{transform:translateX(calc(var(--spiral-x-4) * .6)) translateY(calc(var(--spiral-y-4) * .6)) rotate(calc(var(--spread-rotation) + 900deg)) scale(.95)}70%{transform:translateX(calc(var(--spiral-x-4) * .3)) translateY(calc(var(--spiral-y-4) * .3)) rotate(calc(var(--spread-rotation) + 1080deg)) scale(1.05)}75%{transform:translateX(0) translateY(0) rotate(calc(var(--spread-rotation) + 1260deg)) scale(1)}85%{transform:translateX(0) translateY(0) rotate(calc(var(--spread-rotation) + 1440deg)) scale(1.1);opacity:1}90%{transform:translateX(0) translateY(0) rotate(calc(var(--spread-rotation) + 1440deg)) scale(1);opacity:.8}95%{opacity:.5;transform:translateX(0) translateY(0) rotate(calc(var(--spread-rotation) + 1440deg)) scale(.9)}100%{opacity:0;transform:translateX(0) translateY(0) rotate(calc(var(--spread-rotation) + 1440deg)) scale(.8)}}.shuffle-card.fan{-webkit-animation:fanShuffle 3.5s ease-in-out forwards;animation:fanShuffle 3.5s ease-in-out forwards}@-webkit-keyframes fanShuffle{0%{opacity:0;transform:translateX(0) translateY(0) rotate(0) scale(.5)}10%{opacity:1;transform:translateX(0) translateY(0) rotate(0) scale(.8)}20%{transform:translateX(var(--fan-x)) translateY(var(--fan-y)) rotate(var(--fan-rotation)) scale(1)}40%{transform:translateX(calc(var(--fan-x) * 1.3)) translateY(calc(var(--fan-y) * .8)) rotate(calc(var(--fan-rotation) * 1.2)) scale(1.1)}60%{transform:translateX(calc(var(--fan-x) * .5)) translateY(calc(var(--fan-y) * 1.2)) rotate(calc(var(--fan-rotation) * .7)) scale(.9)}75%{transform:translateX(0) translateY(0) rotate(0) scale(1);opacity:1}85%{opacity:.8;transform:translateX(0) translateY(0) rotate(0) scale(1.05)}100%{opacity:0;transform:translateX(0) translateY(0) rotate(0) scale(.9)}}@keyframes fanShuffle{0%{opacity:0;transform:translateX(0) translateY(0) rotate(0) scale(.5)}10%{opacity:1;transform:translateX(0) translateY(0) rotate(0) scale(.8)}20%{transform:translateX(var(--fan-x)) translateY(var(--fan-y)) rotate(var(--fan-rotation)) scale(1)}40%{transform:translateX(calc(var(--fan-x) * 1.3)) translateY(calc(var(--fan-y) * .8)) rotate(calc(var(--fan-rotation) * 1.2)) scale(1.1)}60%{transform:translateX(calc(var(--fan-x) * .5)) translateY(calc(var(--fan-y) * 1.2)) rotate(calc(var(--fan-rotation) * .7)) scale(.9)}75%{transform:translateX(0) translateY(0) rotate(0) scale(1);opacity:1}85%{opacity:.8;transform:translateX(0) translateY(0) rotate(0) scale(1.05)}100%{opacity:0;transform:translateX(0) translateY(0) rotate(0) scale(.9)}}.shuffle-card.cascade{-webkit-animation:cascadeShuffle 3.5s ease-in-out forwards;animation:cascadeShuffle 3.5s ease-in-out forwards}@-webkit-keyframes cascadeShuffle{0%{opacity:0;transform:translateX(0) translateY(-100px) rotate(0) scale(.6)}8%{opacity:1;transform:translateX(0) translateY(-50px) rotate(0) scale(.8)}15%{transform:translateX(var(--cascade-x)) translateY(var(--cascade-y)) rotate(var(--cascade-rotation)) scale(1)}30%{transform:translateX(calc(var(--cascade-x) * 1.1)) translateY(calc(var(--cascade-y) + 20px)) rotate(calc(var(--cascade-rotation) + 180deg)) scale(1.05)}50%{transform:translateX(calc(var(--cascade-x) * .3)) translateY(calc(var(--cascade-y) * .5)) rotate(calc(var(--cascade-rotation) + 360deg)) scale(.95)}70%{transform:translateX(0) translateY(0) rotate(calc(var(--cascade-rotation) + 540deg)) scale(1)}85%{opacity:1;transform:translateX(0) translateY(0) rotate(calc(var(--cascade-rotation) + 720deg)) scale(1.1)}100%{opacity:0;transform:translateX(0) translateY(0) rotate(calc(var(--cascade-rotation) + 720deg)) scale(.8)}}@keyframes cascadeShuffle{0%{opacity:0;transform:translateX(0) translateY(-100px) rotate(0) scale(.6)}8%{opacity:1;transform:translateX(0) translateY(-50px) rotate(0) scale(.8)}15%{transform:translateX(var(--cascade-x)) translateY(var(--cascade-y)) rotate(var(--cascade-rotation)) scale(1)}30%{transform:translateX(calc(var(--cascade-x) * 1.1)) translateY(calc(var(--cascade-y) + 20px)) rotate(calc(var(--cascade-rotation) + 180deg)) scale(1.05)}50%{transform:translateX(calc(var(--cascade-x) * .3)) translateY(calc(var(--cascade-y) * .5)) rotate(calc(var(--cascade-rotation) + 360deg)) scale(.95)}70%{transform:translateX(0) translateY(0) rotate(calc(var(--cascade-rotation) + 540deg)) scale(1)}85%{opacity:1;transform:translateX(0) translateY(0) rotate(calc(var(--cascade-rotation) + 720deg)) scale(1.1)}100%{opacity:0;transform:translateX(0) translateY(0) rotate(calc(var(--cascade-rotation) + 720deg)) scale(.8)}}.cards-grid.entering{opacity:1;transform:scale(1)}.cards-grid.enter-active{opacity:1;transform:scale(1)}.card.animate-entrance{opacity:0;transform:translateX(var(--entrance-x)) translateY(-50px) rotate(var(--entrance-rotation)) scale(.5);-webkit-animation:cardEntrance .8s ease-out forwards;animation:cardEntrance .8s ease-out forwards}@-webkit-keyframes cardEntrance{0%{opacity:0;transform:translateX(var(--entrance-x)) translateY(-50px) rotate(var(--entrance-rotation)) scale(.5)}30%{opacity:.7;transform:translateX(calc(var(--entrance-x) * .3)) translateY(-20px) rotate(calc(var(--entrance-rotation) * .5)) scale(.8)}60%{opacity:1;transform:translateX(0) translateY(-5px) rotate(0) scale(1.1)}80%{transform:translateX(0) translateY(2px) rotate(0) scale(.95)}100%{opacity:1;transform:translateX(0) translateY(0) rotate(0) scale(1)}}@keyframes cardEntrance{0%{opacity:0;transform:translateX(var(--entrance-x)) translateY(-50px) rotate(var(--entrance-rotation)) scale(.5)}30%{opacity:.7;transform:translateX(calc(var(--entrance-x) * .3)) translateY(-20px) rotate(calc(var(--entrance-rotation) * .5)) scale(.8)}60%{opacity:1;transform:translateX(0) translateY(-5px) rotate(0) scale(1.1)}80%{transform:translateX(0) translateY(2px) rotate(0) scale(.95)}100%{opacity:1;transform:translateX(0) translateY(0) rotate(0) scale(1)}}.card.bounce-settle{-webkit-animation:bounceSettle .4s ease-out;animation:bounceSettle .4s ease-out}@-webkit-keyframes bounceSettle{0%{transform:scale(1.1) translateY(-3px)}50%{transform:scale(.95) translateY(2px)}100%{transform:scale(1) translateY(0)}}@keyframes bounceSettle{0%{transform:scale(1.1) translateY(-3px)}50%{transform:scale(.95) translateY(2px)}100%{transform:scale(1) translateY(0)}}.shuffle-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:1.5rem;color:#4ecdc4;text-shadow:0 2px 4px rgba(0,0,0,.5);opacity:0;-webkit-animation:textPulse 2s ease-in-out;animation:textPulse 2s ease-in-out;pointer-events:none}@-webkit-keyframes textPulse{0%,100%{opacity:0;transform:translate(-50%,-50%) scale(.8)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}}@keyframes textPulse{0%,100%{opacity:0;transform:translate(-50%,-50%) scale(.8)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}}.floating{-webkit-animation:float 3s ease-in-out infinite;animation:float 3s ease-in-out infinite}@-webkit-keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}.pulse{-webkit-animation:pulse 2s ease-in-out infinite;animation:pulse 2s ease-in-out infinite}@-webkit-keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}@media (max-width:1500px){#nh-bnr{background-size:71% 100%!important}}@media (max-width:768px){.tarot-widget{padding:20px 15px}.widget-title{font-size:2rem}.shuffle-container{height:220px}.shuffle-card{width:55px;height:90px}.shuffle-card::before{font-size:1.2rem}#nh-bnr{background-size:83% 100%!important}.shuffle-text{font-size:1.2rem}.cards-grid{grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:10px}.card{width:100px}.card-container{width:100px;height:150px}.selected-card-container{width:14rem;height:24rem}.selected-card .card-info{width:14rem}.selected-card .card-name{font-size:1rem}.selected-card .card-meaning{font-size:.9rem}.result-answer{font-size:2.5rem}}@media (max-width:600px){#nh-bnr{background-repeat:no-repeat;background-size:100% 100%!important}}@media (max-width:480px){.shuffle-container{height:180px}#nh-bnr{background-size:167% 100%!important}.shuffle-card{width:45px;height:75px}.shuffle-card::before{font-size:1rem}.shuffle-text{font-size:1rem}.cards-grid{grid-template-columns:repeat(3,1fr)}.card{width:90px}.card-container{width:90px;height:140px}.selected-cards-display{flex-direction:column;align-items:center;gap:15px}.selected-card-container{width:12rem;height:20rem}.selected-card .card-info{width:100%}.result.show{width:100%}.selected-card .card-name{font-size:.9rem}.selected-card .card-meaning{font-size:.8rem}.controls{margin:20px 0}.reveal-button,.shuffle-button,.start-button{display:block;margin:10px auto}}