:root{font-family:Times New Roman,Times,serif;line-height:1.5;font-weight:500;color-scheme:light dark;color:#000000de;background-color:#004c33;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.top-bar{width:100vw;height:10vh;background-color:#004c33;color:beige;display:flex;justify-content:center;align-items:center;gap:4vw}.bottom-bar{width:100vw;height:5vh;background-color:#004c33;color:beige;display:flex;justify-content:center;align-items:center;gap:5vw}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}@property --rx{syntax: "<angle>"; initial-value: 0deg; inherits: false;}@property --ry{syntax: "<angle>"; initial-value: 0deg; inherits: false;}@property --s{syntax: "<number>"; initial-value: 1; inherits: false;}@property --float{syntax: "<length>"; initial-value: 0px; inherits: false;}.center-components{display:flex;justify-content:center;align-items:center}#root{text-align:center;overflow:hidden}.card-table{position:absolute;background:#004c33;width:100vw;height:90vh;justify-content:center;display:flex;align-items:center;gap:2vh;overflow:hidden}.card-table .allign-top{align-items:top;padding-top:2%}.playing-card{width:24vh;height:36vh;background-color:beige;border-radius:12px;box-shadow:0 6px 15px #0000002e;position:relative;font-size:3vh;--t: 0deg;--rx: 0deg;--ry: 0deg;--s: 1;transform-style:preserve-3d;transform:translateY(calc(sin(var(--t))*-10px)) rotateX(var(--rx)) rotateY(var(--ry)) scale(var(--s));transition:--rx .22s cubic-bezier(.2,.8,.2,1),--ry .22s cubic-bezier(.2,.8,.2,1),--s .3s cubic-bezier(.34,1.56,.64,1),box-shadow .22s ease-out;will-change:transform;cursor:pointer;padding:2vh;--suit-size: 4vh;--pad: 8px;justify-content:center;display:flex;align-items:center}.playing-card:hover{--rx: 10deg;--ry: 12deg;--s: 1.08;animation:floatIdle 2.6s linear infinite;box-shadow:0 14px 28px #00000080}.deal .playing-card{animation:deal .52s cubic-bezier(.2,.7,.2,1) both,floatIdle 4s linear infinite;animation-delay:calc(var(--i) * .12s),calc(var(--i) * .12s + .52s)}.info-card{width:24vh;height:36vh;background-color:beige;border-radius:12px;box-shadow:0 6px 15px #0000002e;position:relative;font-size:3vh;--t: 0deg;--rx: 0deg;--ry: 0deg;--s: 1;transform-style:preserve-3d;transform:translateY(calc(sin(var(--t))*-10px)) rotateX(var(--rx)) rotateY(var(--ry)) scale(var(--s));transition:--rx .22s cubic-bezier(.2,.8,.2,1),--ry .22s cubic-bezier(.2,.8,.2,1),--s .3s cubic-bezier(.34,1.56,.64,1),box-shadow .22s ease-out;will-change:transform;cursor:pointer;padding:2vh;--suit-size: 4vh;--pad: 8px;justify-content:center;display:flex;align-items:center}.info-card:hover{--s: 1.08;animation:floatIdle 2.6s linear infinite;box-shadow:0 14px 28px #00000080}.deal .info-card{animation:info-deal .7s cubic-bezier(.2,.7,.2,1) both,floatIdle 4s linear infinite;animation-delay:calc(var(--i) * .12s),calc(var(--i) * .12s + .52s)}.info-card.dismiss{animation:dismiss-info-card .2s ease-in forwards;pointer-events:none}.corner{position:absolute;display:flex;flex-direction:column;align-items:left;--pad: 8px;--suit-size: 2.5vh;font-size:3.5vh;font-weight:700;line-height:1}.corner .suit{width:var(--suit-size);height:var(--suit-size)}.corner.top-left{top:var(--pad);left:var(--pad);display:flex;flex-direction:column;align-items:left}.corner.bottom-right{bottom:var(--pad);right:var(--pad);transform:rotate(180deg)}.card-text{text-justify:newspaper}.card-stack-row{display:flex;flex-direction:row;align-items:left;gap:2vh}@keyframes deal{0%{transform:translate(-50vw,50vh) rotate(-45deg) rotateY(180deg);opacity:0}10%{transform:translate(var(--tx),var(--ty)) rotate(var(--r)) rotateX(var(--rx)) rotateY(180deg) scale(var(--s));opacity:1}to{transform:translate(var(--tx),var(--ty)) rotate(var(--r)) rotateX(var(--rx)) rotateY(var(--ry)) scale(var(--s));opacity:1}}@keyframes info-deal{0%{transform:translate(-50vw,50vh) rotate(-20deg) rotateY(90deg);opacity:0}10%{transform:translate(var(--tx),var(--ty)) rotate(var(--r)) rotateX(var(--rx)) rotateY(100deg) scale(var(--s));opacity:1}to{transform:translate(var(--tx),var(--ty)) rotate(var(--r)) rotateX(var(--rx)) rotateY(var(--ry)) scale(var(--s));opacity:1}}@keyframes floatIdle{0%{--t: 0deg}to{--t: 360deg}}@keyframes dismiss-info-card{0%{opacity:1;transform:var(--current-transform, scale(1))}to{opacity:0;transform:var(--current-transform, scale(1)) scale(.8)}}@media (prefers-reduced-motion: reduce){.deal .card{animation:none;opacity:1;transform:translate(var(--tx),var(--ty)) rotate(var(--r))}}@keyframes bounceFadeIn{0%{opacity:0;transform:translateY(16px) scale(.98)}60%{opacity:1;transform:translateY(-8px) scale(1.02)}80%{transform:translateY(4px) scale(.995)}to{opacity:1;transform:translateY(0) scale(1)}}.bounce-fade{display:inline-block;animation-name:bounceFadeIn;animation-duration:var(--duration, .7s);animation-delay:var(--delay, 0ms);animation-timing-function:ease-out;animation-fill-mode:both;will-change:opacity,transform}@media (prefers-reduced-motion: reduce){.bounce-fade{animation:none!important;opacity:1!important;transform:none!important}}.modal{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;animation:fade-in-background .2s ease-out forwards;z-index:1000}.modal.dismiss{animation:fade-out-background .2s ease-in forwards}.modal-content{color:#242424;border-radius:12px;padding:16px 20px;width:min(640px,90vw);max-height:85vh;overflow:auto;position:relative}.modal-close{position:absolute;top:8px;right:10px;background:transparent;border:none;color:inherit;font-size:24px;cursor:pointer}.modal-header{display:flex;align-items:center;gap:8px;margin-bottom:8px}.modal-header h2{font-size:6vmin;margin-bottom:.5rem}.modal-body{font-size:3vmin;line-height:1.6}.modal-body p{margin-bottom:1rem}.project-links{margin-top:1.5rem;font-size:2.2vmin;text-align:center}.project-links a{color:#0056b3;text-decoration:none;font-weight:600;margin:0 .5rem}.project-links a:hover{text-decoration:underline}@keyframes fade-in-background{0%{background:#0000}to{background:#00000080}}@keyframes fade-out-background{0%{background:#00000080}to{background:#0000}}