.card-container{width:1080px;max-width:100%;margin:0 auto;display:flex;justify-content:center;align-items:center;padding:30px;box-sizing:border-box}.card-detail{width:calc(33.33% - 20px);margin:10px}.card{position:relative;width:200px;height:300px;z-index:1;transition:transform 0.3s,opacity 0.5s;opacity:1}.selected-cards-hidden .card{display:none}.selected-card-details{display:none;flex-direction:column;align-items:center}.selected-card-details.show{display:flex;align-items:center}.top-row{display:flex;justify-content:space-around;width:100%;margin-bottom:20px;align-items:flex-start}.top-row .card-detail{flex-basis:calc(33.33% - 20px);flex-grow:1;margin:10px}.bottom-row{display:flex;justify-content:space-around;width:100%;margin-top:20px;align-items:flex-start}.bottom-row .card-detail{flex-basis:calc(33.33% - 20px);margin:10px}.card:first-child{margin-left:0}.card:not(:first-child){margin-left:-150px}.front{display:block;width:100%;height:100%}.card img{transition:transform 0.3s,opacity 0.5s}.card:hover img{transform:translateY(-20px);cursor:pointer;border-radius:10px}.card.selected:hover img{transform:translateY(0);cursor:default}@media (max-width:767px){.card-detail{min-height:200px}.top-row{display:flex;justify-content:center;align-items:flex-start;margin-bottom:20px}.top-row .card-detail{width:calc(33.33% - 20px);margin:15px 10px}.bottom-row{margin-top:10px;display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start}.bottom-row .card-detail{width:calc(33.33% - 20px);margin:15px 10px}.bottom-row .card-detail:nth-child(4){width:100%;margin:20px auto 0}.card-detail h3{text-align:center}.tarotGameContainer .tarotCardWrap{font-size:16px;background-image:linear-gradient(180deg,#a097d714 0%,#06061d 100%);border-radius:20px;overflow:hidden;padding:10px;position:relative;border:1px solid #424242;min-height:555px;display:flex;flex-direction:column;gap:20px;justify-content:space-between}}.cardContainer{width:100%;margin:0 auto;display:flex;justify-content:center;align-items:center}.personEnd{display:none}.card{position:relative;width:174px;height:296px;z-index:1;transition:transform 0.3s,opacity 0.5s}.card:first-child{margin-left:0}.card:not(:first-child){margin-left:-110px}.card img{transition:transform 0.3s,opacity 0.5s}.card:hover img{transform:translateY(-20px);cursor:pointer;box-shadow:rgb(255 215 0 / .8) 0 0 12px;border-radius:25px}.card .active{transform:translateY(-20px);box-shadow:rgb(117 97 255 / .8) 0 0 12px;border-radius:10px}.card:hover .overlay{opacity:1}.card:not(:hover){transition-delay:0.2s}.card:not(:hover) .overlay{transition-delay:0s}.bg-onecard{display:none;justify-content:center;align-items:center;width:100%;height:100%}.bg-onecard.active{display:flex}.tarotChatHead{display:flex;align-items:center;gap:10px;border-bottom:1px solid #ffffff36;line-height:1.3}.tarotChatHead img{flex:0 0 32px;margin:0}.tarotChatHead span{color:#fff;font-family:"Helvetica",Helvetica,Arial,Lucida,sans-serif;font-size:20px;font-weight:700}.oneCardSpread{display:flex;flex-direction:column;gap:20px;justify-content:space-between;height:100%}.tarotGameContainer{display:flex;flex-direction:row;justify-content:center;gap:30px}.tarotGameContainer .tarotChatWrap{order:1;width:90%}.tarotGameContainer .tarotCardWrap{order:2;width:90%}.tarotChat-body{max-height:452px;overflow-y:auto;position:relative;scrollbar-width:none;-ms-overflow-style:none}.tarotChatBody .messages{display:flex;flex-direction:column-reverse;width:100%}.tarotChatBody .messages::-webkit-scrollbar{display:none}.messages{padding-left:0}.messages li{display:flex;justify-content:flex-end;align-items:center;list-style:none;padding:10px;margin:0 0 20px;font-size:16px;border-radius:10px;background-color:#282b83;word-wrap:break-word;max-width:92%;color:#fff;clear:both}.messages li.user-message{animation:show-chat-odd 0.15s 1 ease-in;float:right;background-color:#59547c}.messages li.response-message{animation:show-chat-even 0.15s 1 ease-in;float:left}.front{display:block;width:100%;height:100%}.loadCards{position:absolute;z-index:-1;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center}#cardbuttons{flex-direction:column;padding-top:0}#cardbuttons button{width:100%}.tarotContainer{display:flex;flex-direction:row;gap:30px;justify-content:center}.tarotContainer .tarotChatWrap,.tarotContainer .tarotCardWrap{font-size:16px;background-image:linear-gradient(180deg,#a097d714 0%,#06061d 100%);border-radius:20px;overflow:hidden;padding:10px;position:relative;border:1px solid #424242;min-height:684px;display:flex;flex-direction:column;gap:20px;justify-content:space-between}.tarotContainer .tarotChatWrap{order:1;width:90%}.tarotContainer .tarotCardWrap{order:2;width:90%}button#resetGame,a#allGames{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:15px;width:160px;height:48px;border:1px solid #1749f3;border-radius:12px;background-color:#fff0;color:#fff;flex:none;order:0;flex-grow:0;font-family:"Helvetica Now Display",sans-serif;font-size:16px;line-height:24px;text-align:center;cursor:pointer;transition:background-color 0.3s,color 0.3s}button#resetGame:hover,a#allGames:hover{background-color:#1749f3;color:#fff;border:1px solid #fff}button.chatSubmit{appearance:auto;writing-mode:horizontal-tb!important;text-rendering:auto;color:buttontext;letter-spacing:normal;word-spacing:normal;line-height:normal;text-transform:none;text-indent:0;text-shadow:none;display:inline-block;text-align:center;align-items:flex-start;cursor:default;box-sizing:border-box;background-color:buttonface;margin:0em;padding:1px 6px;border-width:2px;border-style:outset;border-color:buttonborder;border-image:initial}button.chatSubmit:enabled{cursor:pointer;background-color:#123cac;box-shadow:rgba(3.5,13.4,40.3,.8) 0 4px 12px}button.chatSubmit:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.dot{height:5px;width:5px;margin:0 2px;background-color:#fff;border-radius:50%;display:inline-block;animation:dot 1.2s infinite}.dot:nth-child(1){animation-delay:0s}.dot:nth-child(2){animation-delay:0.2s}.dot:nth-child(3){animation-delay:0.4s}@keyframes dot{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-10px)}}#userInput::placeholder{color:rgb(255 255 255);font-size:15px;text-align:left}.card-layout{display:flex;flex-direction:column;align-items:center}.card-row{display:flex;flex-wrap:wrap;justify-content:center}.middle{display:flex;justify-content:space-between;width:80%}.bottom{display:flex;flex-wrap:wrap;justify-content:space-between;width:80%}.above-card,.cross-card,.center-card,.future-card,.fiddle-card,.faddle-card,.extra-card{margin:20px}@media (min-width:768px){.middle{width:80%;justify-content:space-between}.bottom{width:80%;justify-content:space-between}.above-card,.cross-card,.center-card,.future-card,.fiddle-card,.faddle-card,.extra-card{width:250px;height:350px}}@media (max-width:767px){.middle{width:100%;justify-content:center}.bottom{width:100%;justify-content:center}.above-card,.cross-card,.center-card,.future-card,.fiddle-card,.faddle-card,.extra-card{width:150px;height:200px}}