:root{background-color:#f4f4f4;background-image:url(/assets/background-CI9sXgb_.png);background-position:50%;background-repeat:no-repeat;background-size:cover;justify-content:center;align-items:center;min-height:100vh;margin:0;padding:0;font-family:Arial,sans-serif;display:flex;overflow:hidden}.contentArea{width:30rem;max-width:90vw;height:40rem;max-height:90vh;filter:alpha(opacity=30);box-sizing:border-box;background-color:#cfcfcf4d;border-radius:15px;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.deckContainer{box-sizing:border-box;grid-template-columns:repeat(3,1fr);grid-auto-rows:minmax(0,1fr);gap:1rem;width:100%;height:100%;max-height:90vh;margin:auto;padding:5%;display:grid;overflow:hidden}@media screen and (max-width:500px){.deckContainer{grid-template-columns:repeat(2,1fr)}}.deckArea{box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;width:100%;min-width:0;height:100%;min-height:0;display:flex;overflow:hidden}.deckArea img{object-fit:cover;border:3px solid #827979;border-radius:10px;flex-shrink:1;max-width:100%;height:65%}.deckInfo{flex-shrink:0;justify-content:center;align-items:center;width:100%;display:flex}.deckArea p,.deckName{text-align:center;flex-shrink:0;margin:0;padding:.5rem 0;font-size:1em;font-weight:700}.dropdown{display:inline-block;position:relative}.dropdown-toggle{color:#fff;cursor:pointer;border:1px solid #ccc;border-radius:5px;justify-content:space-between;align-items:center;width:12rem;padding:10px 20px;display:flex}.dropdown-toggle-icon{border-top:5px solid #000;border-left:5px solid #0000;border-right:5px solid #0000;width:0;height:0}.dropdown-content{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);color:#fff;z-index:1000;background-color:#0006;border-radius:5px;flex-direction:column;gap:.5rem;width:12rem;padding:10px 20px;display:flex;position:absolute;top:100%;left:0;box-shadow:0 0 10px #0000001a}.dropdown-option.selected,.dropdown-option:hover{cursor:pointer;background-color:#ffffff1a;transition:background-color .3s}.dropdown-option{border-bottom:1px solid #fff}.column-settings{color:#212121;background-color:#69410180;border-radius:10px;flex-direction:column;justify-content:center;width:100%;height:100%;padding:1rem;display:flex;box-shadow:0 2px 10px #00000080}.title{margin-bottom:20px;font-size:1.2em}#currentDeck{justify-content:center;align-items:center;gap:10px;height:50%;margin-bottom:20px;display:flex}#currentDeck-info{flex-direction:column;align-items:start;height:100%;font-size:.9em;display:flex}#currentDeck-info .deck-name{font-size:1.4em;font-weight:700}#currentDeck-img{object-fit:cover;border-radius:5px;width:50%;max-height:100%}.field{margin-bottom:15px}.options-spread-container{justify-content:space-between;display:flex}.question-container{justify-content:flex-start;align-items:center;gap:1rem;padding:.5rem 0;display:flex}.question-input{background-color:#7c5619;border:1px solid #73480f;border-radius:5px;width:100%;padding:.5rem}.question-label{color:#aaa;width:10%;font-size:.9em}.field label{margin-bottom:5px;font-size:.9em;display:block}.field input,.field select{color:#fff;box-sizing:border-box;background-color:#333;border:1px solid #444;border-radius:5px;width:100%;padding:8px}.field input:focus,.field select:focus{border-color:#007bff;outline:none}.field select:disabled{opacity:.5;cursor:not-allowed}#deckSelectBlock{align-items:center;gap:10px;display:flex}#select-img-container{align-items:center;display:flex}#select-img{object-fit:cover;border-radius:5px;width:auto;max-height:50px;margin:0;padding:0}.attributes{margin-bottom:20px}.attributes label{margin-bottom:5px;font-size:.9em;display:block}.attribute-list{flex-wrap:wrap;gap:10px;display:flex}.attribute{cursor:pointer;background-color:#73480f;border-radius:5px;padding:5px 10px;transition:background-color .3s}.attribute:hover{background-color:#555}.options label{margin-bottom:10px;font-size:.9em;display:block}.option{cursor:pointer;align-items:center;gap:10px;margin-bottom:10px;transition:opacity .3s;display:flex}.option.disabled{opacity:.5;cursor:not-allowed}.icon{background-color:#d29b3d;border-radius:50%;width:20px;height:20px}.border{background-color:#c4b6b6}.color{background-color:#73480f}.option:not(.disabled)>.icon:hover{background-color:#755f43}.actions{justify-content:space-between;align-items:center;gap:10px;width:100%;margin-top:20px;display:flex}.actions svg{color:#fff;width:20px;height:20px}.actions svg:hover,.actions svg:active{transition:transform .3s ease-in-out;transform:scale(1.1)}.reverse-card{transform:rotate(180deg)}.result-container{flex-direction:column;flex-grow:1;width:100%;height:100%;display:flex;position:relative}.question-area{justify-content:start;align-items:center;height:5%;margin-top:1rem;margin-bottom:1rem;padding-left:1rem;font-size:1.2rem;font-weight:700;display:flex}.toggle-hidden-area{z-index:1000;background-color:#0000004d;flex-direction:column;align-items:center;width:100%;height:fit-content;transition:transform .3s ease-in-out;display:flex;position:absolute;bottom:0;left:0}.toggle-hidden-area.hidden{background-color:#0000;transform:translateY(calc(100% - 30px))}.toggle-hidden-area.open{transform:translateY(0%)}.toggle-hidden-btn{justify-content:center;align-items:center;width:100%;height:30px;transition:transform .4s ease-in-out;display:flex}.toggle-hidden-btn svg{width:30px;height:30px}.toggle-hidden-btn:hover svg{width:35px;height:35px}.toggle-hidden-btn:hover{transform:scale(1.1)}.toggle-hidden-btn:active{transform:scale(.9)}.actions-area{z-index:0;justify-content:space-between;align-items:center;width:90%;height:10%;margin:.5rem auto;display:flex}.actions-btn{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.detail-card-modal{z-index:1010;justify-content:center;align-items:center;width:100%;height:100%;transition:display .3s ease-in-out;display:none;position:fixed;top:0;left:0}.detail-card-modal.open{display:flex}@keyframes smoothAppear{0%{opacity:0;transform:translateY(-5%)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}.detail-card-modal-content{box-sizing:border-box;background-color:#cfcfcfcc;border-radius:15px;flex-direction:column;justify-content:center;align-items:center;width:30rem;max-width:90vw;height:40rem;max-height:90vh;animation:.8s linear forwards fadeIn;display:flex;position:relative;overflow:hidden}.detail-card-modal-header{text-align:center;white-space:nowrap;flex-direction:row;justify-content:center;align-items:center;width:100%;padding:0 20px;font-size:1.2rem;font-weight:700;display:flex}.detail-card-modal-header-name{text-overflow:ellipsis;white-space:nowrap;width:100%;padding:0 20px;overflow:hidden}.reverse-card-name{text-align:center;margin:auto 0;font-size:.9rem;font-weight:400}.detail-card-modal-overlay{background-color:#00000080;width:100%;height:100%;position:absolute;top:0;left:0}.detail-card-modal-close-btn{cursor:pointer;color:#000;width:30px;height:30px;position:absolute;top:20px;right:20px}.detail-card-modal-close-btn:hover{transition:transform .3s ease-in-out;transform:scale(1.1)}.detail-card-modal-header-close{width:20px;height:20px}.detail-card-modal-img{object-fit:contain;object-position:center;width:80%;height:40%;transition:transform .7s ease-in-out,animation .7s ease-in-out}.detail-card-modal-img.focused{transform:scale(1.5)translateY(20%)}.detail-card-modal-img.blur{transform:scale(1)translateY(0%)}.detail-card-modal-img.reverse-card{transform:rotate(180deg)}.detail-card-modal-img.reverse-card.focused{animation:.7s ease-in-out forwards focusReverseCard}.detail-card-modal-img.reverse-card.blur{animation:.7s ease-in-out forwards blurReverseCard}@keyframes blurReverseCard{0%{transform:rotate(0)scale(1.5)translateY(20%)}50%{transform:rotate(0)}to{transform:rotate(180deg)}}@keyframes focusReverseCard{0%{transform:rotate(180deg)}50%{transform:rotate(0)}to{transform:rotate(0)scale(1.5)translateY(20%)}}.read-container{white-space:pre-wrap;flex-direction:column;width:80%;height:60%;font-size:1rem;display:flex;overflow-y:scroll}.main-read{font-size:1.2rem}.main-read strong{font-weight:700}.type-read,.spread-read{font-size:.8rem}.spread-area{box-sizing:border-box;width:100%;height:80%;padding:5%;display:grid;position:relative}.spread-card{justify-self:center;width:100%;height:100%;position:relative}.placeholder-card img{opacity:.1;object-fit:contain;border-radius:10px;width:100%;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,50%)}.reverse-wrap{width:100%;height:100%}.reverse-wrap.is-reverse{transform:rotate(180deg)}.flip-card{width:100%;height:100%;transform-style:preserve-3d;perspective-origin:150% 150%;transition:transform 1s ease-in-out;position:absolute;transform:perspective(1000px)rotateY(0)}.flip-img{object-fit:contain;backface-visibility:hidden;border-radius:10px;width:100%;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,50%)}.card-front{transform:rotateY(180deg)translate3d(50%,-50%,5px)}.card-back{transform:rotateY(0)translate3d(-50%,-50%,5px)}.card-left{background-color:red;width:10px;transform:rotateY(-90deg)translateZ(5px)}.card-right{background-color:red;width:10px;transform:rotateY(90deg)translateZ(5px)}.flip-card.spin{animation:2s infinite spinY}@keyframes spinY{0%{transform:rotateY(0)}to{transform:rotateY(180deg)}}.flip-card.cross1 back{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}.card-side{box-sizing:block;z-index:1000;background-color:#00000080;width:20px;height:100%;position:absolute}.flip-card.is-open{transform:rotateY(180deg)}.flip-card.is-opening{animation:2s linear forwards smoothFlipOrigin}@keyframes smoothFlip{0%{transform-origin:0%;border:10px solid red;transform:rotateY(0)}50%{border:10px solid #00f}90%{border:10px solid #ff0;transform:rotateY(150deg)translate(-10%)}to{border:10px solid green;transform:rotateY(180deg)}}@keyframes smoothFlipOrigin{0%{transform-origin:center 50% 50%}to{transform:rotate(180deg)}}.spread-info.is-reverse{text-align:right}.spread-card p{text-align:center;opacity:0;color:#00000067;font-size:.6rem;display:inline-block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.placeholder-img{opacity:.1;object-fit:contain;width:100%}.draw-area{flex-wrap:wrap;width:95%;height:35vh;max-height:35vh;transition:opacity .5s ease-out,transform .7s ease-in-out,max-height 1s ease-in-out,height 1.7s ease-in-out;display:grid;overflow:hidden visible}.draw-area.not-completed{opacity:1;animation:1s ease-out forwards mountAnimation;transform:scale(.7)}.draw-area.completed{opacity:1;animation:1s ease-out forwards unmountAnimation;transform:scale(1)}@keyframes mountAnimation{0%{opacity:.9;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes unmountAnimation{0%{opacity:0;transform:scale(1)}to{opacity:0;height:0;max-height:0;display:none;transform:scale(.7)}}.draw-card{z-index:0;width:100%;height:100%;position:relative}.draw-card-img{object-fit:contain;width:140%;transition:transform .7s ease-in-out;position:absolute}.draw-card.disabled{opacity:0;pointer-events:none}.draw-card.disabled:hover{transform:none}.draw-card.disabled img{display:none}.draw-area.is-shuffling{opacity:.5;animation:1s ease-out forwards mountAnimation;transform:scale(.7)}.draw-shuffle{z-index:1000;width:100%;height:100%;position:fixed;top:0;left:0}.draw-shuffle-card{object-fit:cover;width:30%;position:absolute;top:50%;left:50%}.draw-shuffle{flex-wrap:wrap;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.draw-shuffle .card1{transform-origin:50% 0;animation:10s infinite shuffle1}.draw-shuffle .card2{transform-origin:50% 0;animation:10s infinite shuffle2}.draw-shuffle .card3{transform-origin:50% 0;animation:10s infinite shuffle3}.draw-shuffle .card4{transform-origin:50% 0;animation:10s infinite shuffle4}.draw-shuffle .card5{transform-origin:50% 0;animation:10s infinite shuffle5}.draw-shuffle .card6{transform-origin:50% 0;animation:10s infinite shuffle6}.draw-shuffle .card7,.draw-shuffle .card8{transform-origin:50% 0;animation:10s infinite shuffle7}.draw-shuffle-card{aspect-ratio:6.1/8.5;transform-origin:50%;width:30%;height:auto;animation:cardShuffle var(--animation-duration,1s)ease-in-out infinite;position:absolute}@keyframes shuffle1{0%{z-index:6;transform:translate(0%)}5%{z-index:6;transform:translate(-105%)skewY(10deg)}6%{z-index:0}10%{z-index:0;transform:translate(0%)}20%{z-index:1}30%{z-index:2}40%{z-index:3}50%{z-index:4}60%{z-index:5}70%{z-index:6;transform:translate(0%)}75%{transform:translateY(-130%)}90%{transform:translateY(-130%)}}@keyframes shuffle2{0%{z-index:5}10%{z-index:6;transform:translate(0%)}15%{z-index:6;transform:translate(-105%)skewY(10deg)}16%{z-index:0}20%{z-index:0;transform:translate(0%)}30%{z-index:1}40%{z-index:2}50%{z-index:3}60%{z-index:4}70%{z-index:5;transform:translate(0%)}72%{transform:translate(0%)}77%{transform:translate(110%,-100%)}90%{opacity:0;transform:translate(110%,-100%)}}@keyframes shuffle3{0%{z-index:4}10%{z-index:5}20%{z-index:6;transform:translate(0%)}25%{z-index:6;transform:translate(-105%)skewY(10deg)}26%{z-index:0}30%{z-index:0;transform:translate(0%)}40%{z-index:1}50%{z-index:2}60%{z-index:3}74%{z-index:4;transform:translate(0%)}79%{transform:translate(140%,10%)}90%{opacity:0;transform:translate(140%,10%)}}@keyframes shuffle4{0%{z-index:3}10%{z-index:4}20%{z-index:5}30%{z-index:6;transform:translate(0%)}35%{z-index:6;transform:translate(-105%)skewY(10deg)}36%{z-index:0}40%{z-index:0;transform:translate(0%)}50%{z-index:1}60%{z-index:2}76%{z-index:3;transform:translate(0%)}81%{transform:translate(80%,117%)}90%{opacity:0;transform:translate(80%,117%)}}@keyframes shuffle5{0%{z-index:2}10%{z-index:3}20%{z-index:4}30%{z-index:5}40%{z-index:6;transform:translate(0%)}45%{z-index:6;transform:translate(-105%)skewY(10deg)}46%{z-index:0}50%{z-index:0;transform:translate(0%)}60%{z-index:1}78%{z-index:2;transform:translate(0%)}83%{transform:translate(-80%,117%)}90%{opacity:0;transform:translate(-80%,117%)}}@keyframes shuffle6{0%{z-index:1}10%{z-index:2}20%{z-index:3}30%{z-index:4}40%{z-index:5}50%{z-index:6;transform:translate(0%)}55%{z-index:6;transform:translate(-105%)skewY(10deg)}56%{z-index:0}60%{z-index:0;transform:translate(0%)}80%{z-index:1;transform:translate(0%)}85%{transform:translate(-140%,10%)}90%{opacity:0;transform:translate(-140%,10%)}}@keyframes shuffle7{0%{z-index:0}10%{z-index:1}20%{z-index:2}30%{z-index:3}40%{z-index:4}50%{z-index:5}60%{z-index:6;transform:translate(0%)}65%{z-index:6;transform:translate(-105%)skewY(10deg)}66%{z-index:0}70%{z-index:0;transform:translate(0%)}82%{z-index:0;transform:translate(0%)}87%{transform:translate(-110%,-100%)}90%{opacity:0;transform:translate(-110%,-100%)}}