: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;--font-size-xs: clamp(12px, 2.5vw, 14px);--font-size-sm: clamp(14px, 3vw, 16px);--font-size-base: clamp(16px, 4vw, 18px);--font-size-lg: clamp(18px, 5vw, 20px);--font-size-xl: clamp(20px, 6vw, 24px);--font-size-2xl: clamp(24px, 8vw, 32px);--font-size-3xl: clamp(28px, 10vw, 40px);--space-xs: clamp(4px, 1vw, 8px);--space-sm: clamp(8px, 2vw, 16px);--space-md: clamp(12px, 3vw, 24px);--space-lg: clamp(16px, 4vw, 32px);--space-xl: clamp(20px, 5vw, 40px);--space-2xl: clamp(24px, 6vw, 48px)}.desktop-top-bar{width:100vw;height:clamp(60px,10vh,80px);min-height:60px;background-color:#004c33;color:beige;display:flex;justify-content:center;align-items:center;gap:clamp(16px,4vw,32px);cursor:pointer}.fixed-desktop-header{position:fixed;top:0;left:0;z-index:1000}.mobile-top-bar{width:100vw;height:clamp(60px,10vh,80px);min-height:60px;background-color:#004c33;color:beige;display:flex;justify-content:space-between;align-items:center;padding:0 var(--space-md);position:relative;z-index:1000}.mobile-title{font-size:var(--font-size-lg);margin:0;cursor:pointer;text-align:center;flex:1}.hamburger-button{display:flex;flex-direction:column;justify-content:center;align-items:center;width:44px;height:44px;background:transparent;border:none;cursor:pointer;padding:0;z-index:1001}.hamburger-line{width:24px;height:2px;background-color:beige;margin:2px 0;transition:all .3s ease;transform-origin:center}.hamburger-line.open:nth-child(1){transform:rotate(45deg) translate(6px,6px)}.hamburger-line.open:nth-child(2){opacity:0}.hamburger-line.open:nth-child(3){transform:rotate(-45deg) translate(6px,-6px)}.mobile-icon-placeholder{width:44px;height:44px;display:flex;align-items:center;justify-content:center}.mobile-nav-drawer{position:fixed;top:0;right:-100%;width:80vw;max-width:300px;height:100vh;background-color:#004c33;color:beige;transition:right .3s ease;z-index:1002;box-shadow:-2px 0 8px #0000004d}.mobile-nav-drawer.open{right:0}.mobile-nav-content{padding:var(--space-lg);position:relative;height:100%;display:flex;flex-direction:column}.nav-close-button{position:absolute;top:var(--space-md);right:var(--space-md);background:transparent;border:none;color:beige;font-size:32px;cursor:pointer;width:44px;height:44px;display:flex;align-items:center;justify-content:center}.mobile-nav-menu{display:flex;flex-direction:column;gap:var(--space-lg);margin-top:var(--space-2xl)}.mobile-nav-item{background:transparent;border:none;color:beige;font-size:var(--font-size-lg);font-family:inherit;cursor:pointer;padding:var(--space-md) 0;text-align:left;border-bottom:1px solid rgba(255,255,255,.1);transition:color .2s ease;min-height:44px}.mobile-nav-item:hover,.mobile-nav-item:focus{color:gold}.mobile-nav-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#00000080;z-index:999}.bottom-bar{width:100vw;height:clamp(40px,5vh,60px);min-height:40px;background-color:#004c33;color:beige;display:flex;justify-content:center;align-items:center;gap:clamp(20px,5vw,40px)}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center}@media (min-width: 769px){body{overflow:hidden;position:fixed;width:100vw;height:100vh}}h1{font-size:var(--font-size-3xl);line-height:1.1}h2{font-size:var(--font-size-2xl);line-height:1.2}h3{font-size:var(--font-size-xl);line-height:1.3}p{font-size:var(--font-size-base);line-height:1.5}button{border-radius:8px;border:1px solid transparent;padding:var(--space-sm) var(--space-md);font-size:var(--font-size-base);font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s;min-height:44px}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:100dvh;min-height:-webkit-fill-available;justify-content:center;display:flex;align-items:center;gap:clamp(16px,2vh,32px);overflow:visible}.card-table .align-top{align-items:flex-start;padding-top:2%}.playing-card{transform-style:preserve-3d;transform:translateY(calc(sin(var(--t))*-10px)) rotateX(var(--rx)) rotateY(var(--ry)) scale(var(--s)) translateZ(0);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;backface-visibility:hidden;perspective:1000px;cursor:pointer;padding:clamp(12px,2vh,20px);--suit-size: clamp(24px, 4vh, 32px);--pad: 8px;background-color:beige;border-radius:12px;box-shadow:0 6px 15px #0000002e;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 .42s cubic-bezier(.25,.1,.25,1) both,floatIdle 4s linear infinite;animation-delay:calc(var(--i) * 55ms),calc(var(--i) * 55ms + .42s)}.corner{position:absolute;display:flex;flex-direction:column;align-items:left;--pad: 8px;--suit-size: clamp(20px, 2.5vh, 28px);font-size:clamp(18px,3.5vh,28px);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:clamp(16px,2vh,32px)}.backend-dev-title{position:absolute;top:clamp(16px,3vh,24px);left:50%;transform:translate(-50%);z-index:10;text-align:center;color:beige;font-size:clamp(24px,4vw,48px);font-weight:700;text-shadow:2px 2px 4px rgba(0,0,0,.5);pointer-events:none}.backend-dev-container{position:absolute;top:0;left:0;width:100vw;height:100dvh;min-height:-webkit-fill-available;display:flex;flex-direction:row;justify-content:center;align-items:center;gap:clamp(32px,4vw,64px);background:#004c33;box-sizing:border-box;padding:clamp(20px,3vh,30px) clamp(16px,2vh,32px) clamp(16px,2vh,32px)}.left-hand-container.card-table,.right-hand-container.card-table{position:relative!important;width:100%!important;height:100%!important;max-width:none!important;flex:1;background:transparent!important;border-radius:0!important;overflow:visible;display:flex;align-items:center;justify-content:center;padding:0}@media (max-width: 768px){.backend-dev-title{top:clamp(10px,2vh,16px);font-size:clamp(20px,5vw,32px);padding:0 20px}.backend-dev-container{flex-direction:column;align-items:center;gap:clamp(24px,4vh,48px);padding:clamp(60px,8vh,80px) clamp(12px,2vh,24px) clamp(12px,2vh,24px)}.left-hand-container.card-table,.right-hand-container.card-table{width:100%!important;height:auto!important;min-height:clamp(250px,35vh,400px)!important}}@keyframes deal{0%{transform:translate(-8vw,110vh) rotate(-42deg) rotateY(180deg) scale(1);opacity:0}12%{transform:translate(-4vw,55vh) rotate(-28deg) rotateY(110deg) scale(1);opacity:.6}24%{transform:translate(var(--tx),25vh) rotate(-14deg) rotateY(65deg) scale(1);opacity:.85}38%{transform:translate(var(--tx),var(--ty)) rotate(var(--r)) rotateX(var(--rx)) rotateY(35deg) scale(1);opacity:1}52%{transform:translate(var(--tx),var(--ty)) rotate(var(--r)) rotateX(var(--rx)) rotateY(18deg) scale(1);opacity:1}68%{transform:translate(var(--tx),var(--ty)) rotate(var(--r)) rotateX(var(--rx)) rotateY(8deg) scale(1);opacity:1}82%{transform:translate(var(--tx),var(--ty)) rotate(var(--r)) rotateX(var(--rx)) rotateY(2deg) scale(1);opacity:1}92%{transform:translate(var(--tx),var(--ty)) rotate(var(--r)) rotateX(var(--rx)) rotateY(-1deg) scale(1);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}}@media (prefers-reduced-motion: reduce){.deal .card{animation:none;opacity:1;transform:translate(var(--tx),var(--ty)) rotate(var(--r))}}.card-table{overflow:visible;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:clamp(8px,min(1.5vw,2vh),24px);position:fixed;top:0;left:0;width:100vw;height:100vh;box-sizing:border-box;padding:clamp(8px,min(2vw,2vh),20px)}@media (max-width: 768px){.card-table.mobile-layout{overflow-y:auto;overflow-x:hidden;flex-direction:column;justify-content:flex-start;padding:3vw 5vw;gap:4vw;min-height:100vh;position:relative}}.playing-card{width:80vw;max-width:280px;aspect-ratio:2/3;font-size:clamp(16px,4vw,20px);--suit-size: clamp(24px, 6vw, 32px);padding:clamp(12px,3vw,20px)}@media (max-width: 768px){.card-table.mobile-layout .playing-card{width:80vw;max-width:280px;aspect-ratio:2/3;font-size:clamp(16px,4vw,20px);--suit-size: clamp(24px, 6vw, 32px);padding:clamp(12px,3vw,20px);position:relative;margin:0;inset:auto}}@media (min-width: 769px){.playing-card{width:clamp(160px,min(20vw,22vh),320px);height:clamp(240px,min(30vw,33vh),480px);aspect-ratio:2/3;font-size:clamp(14px,min(2.5vw,2.8vh),22px);--suit-size: clamp(20px, min(3vw, 3.5vh), 28px);padding:clamp(8px,min(1.5vw,2vh),16px);max-width:28vw;max-height:42vh}}.corner{--suit-size: clamp(20px, 5vw, 24px);font-size:clamp(18px,4.5vw,22px);--pad: clamp(8px, 2vw, 12px)}@media (max-width: 768px){.card-table.mobile-layout .corner{--suit-size: clamp(20px, 5vw, 24px);font-size:clamp(18px,4.5vw,22px);--pad: clamp(8px, 2vw, 12px)}}@media (min-width: 769px){.corner{--suit-size: clamp(20px, 2.5vh, 28px);font-size:clamp(18px,3.5vh,28px);--pad: 8px}}.card-text{font-size:clamp(14px,2.5vw,18px)}@media (max-width: 768px){.card-table.mobile-layout .card-text{font-size:clamp(14px,2.5vw,18px)}}@media (min-width: 769px){.card-text{font-size:clamp(14px,1.5vh,18px)}}@media (hover: none) and (pointer: coarse){.playing-card:hover{--rx: 0deg !important;--ry: 0deg !important;--s: 1 !important;transform:none!important;animation:none!important;box-shadow:0 6px 15px #0000002e!important}.playing-card:active{--s: 1.02;box-shadow:0 8px 16px #00000040;transform:scale(1.02)!important}.deal .playing-card{animation:deal-mobile-place .38s cubic-bezier(.25,.08,.25,1) both;animation-delay:calc(var(--i) * 35ms)}}@keyframes deal-mobile-place{0%{transform:translateY(100px) translate(-25px) scale(1) rotate(-38deg) translateZ(0);opacity:0}20%{transform:translateY(50px) translate(-12px) scale(1) rotate(-22deg) translateZ(0);opacity:.55}40%{transform:translateY(25px) translate(-6px) scale(1) rotate(-11deg) translateZ(0);opacity:.85}60%{transform:translateY(8px) translate(-2px) scale(1) rotate(-4deg) translateZ(0);opacity:.95}80%{transform:translateY(-1px) translate(1px) scale(1) rotate(1deg) translateZ(0);opacity:1}to{transform:translateY(0) translate(0) scale(1) rotate(0) translateZ(0);opacity:1}}@keyframes deal-mobile{0%{transform:translateY(80px) translate(-20px) scale(1) translateZ(0);opacity:0}to{transform:translateY(0) translate(0) scale(1) translateZ(0);opacity:1}}@media (hover: none) and (pointer: coarse) and (max-width: 768px){.playing-card,.info-card{transform:translateZ(0);backface-visibility:hidden;perspective:1000px}@media (max-height: 600px){.deal .playing-card{animation:deal-mobile-simple .38s cubic-bezier(.25,.08,.25,1) both;animation-delay:calc(var(--i) * 35ms)}}@keyframes deal-mobile-simple{0%{opacity:0}to{opacity:1}}.card-table{container-type:inline-size}@container (max-width: 400px){.playing-card{width:90%;font-size:var(--font-size-sm);--suit-size: var(--font-size-lg)}}@container (max-width: 300px){.playing-card{width:95%;font-size:var(--font-size-xs);padding:var(--space-sm)}.corner{--suit-size: var(--font-size-base);font-size:var(--font-size-sm);--pad: var(--space-xs)}}}@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}}.card-tooltip{background-color:beige;border-radius:12px;box-shadow:0 6px 15px #0000002e;padding:12px 16px;font-size:clamp(14px,2vh,18px);color:#242424;max-width:280px;word-wrap:break-word;animation:tooltip-fade-in .2s ease-out forwards;will-change:opacity,transform;transform:translateZ(0);backface-visibility:hidden;position:relative}.card-tooltip-arrow{position:absolute;width:0;height:0;border:8px solid transparent}.card-tooltip-arrow-top{bottom:-16px;left:50%;transform:translate(-50%);border-top-color:beige}.card-tooltip-arrow-bottom{top:-16px;left:50%;transform:translate(-50%);border-bottom-color:beige}.card-tooltip-arrow-left{right:-16px;top:50%;transform:translateY(-50%);border-left-color:beige}.card-tooltip-arrow-right{left:-16px;top:50%;transform:translateY(-50%);border-right-color:beige}@keyframes tooltip-fade-in{0%{opacity:0;transform:scale(.95) translateZ(0)}to{opacity:1;transform:scale(1) translateZ(0)}}@media (max-width: 768px){.card-tooltip{font-size:clamp(12px,3vw,16px);padding:10px 14px;max-width:240px}}@media (prefers-reduced-motion: reduce){.card-tooltip{animation:none!important;opacity:1!important;transform:none!important}}:root{--modal-backdrop-color: rgba(0, 0, 0, .6);--modal-background: #f5f5dc;--modal-border-radius: 16px;--modal-text-color: #242424;--modal-shadow: 0 20px 40px rgba(0, 0, 0, .15), 0 8px 16px rgba(0, 0, 0, .1);--modal-spacing-xs: 8px;--modal-spacing-sm: 12px;--modal-spacing-md: 16px;--modal-spacing-lg: 24px;--modal-spacing-xl: 32px;--modal-font-size-xs: clamp(12px, 2.5vw, 14px);--modal-font-size-sm: clamp(14px, 3vw, 16px);--modal-font-size-base: clamp(16px, 3.5vw, 18px);--modal-font-size-lg: clamp(20px, 4vw, 24px);--modal-font-size-xl: clamp(24px, 5vw, 32px);--modal-close-size: 44px;--modal-close-icon-size: 20px}.modal{position:fixed;inset:0;background:var(--modal-backdrop-color);display:flex;align-items:center;justify-content:center;padding:var(--modal-spacing-md);z-index:1000;animation:modal-fade-in .2s ease-out forwards;will-change:opacity}.modal.dismiss{animation:modal-fade-out .2s ease-in forwards}.modal-content{background:var(--modal-background);border-radius:var(--modal-border-radius);box-shadow:var(--modal-shadow);color:var(--modal-text-color);width:100%;max-width:min(600px,90vw);max-height:85vh;display:flex;flex-direction:column;position:relative;animation:modal-slide-in .3s cubic-bezier(.2,.8,.2,1) forwards;will-change:transform,opacity}.modal-close{position:absolute;top:var(--modal-spacing-sm);right:var(--modal-spacing-sm);width:var(--modal-close-size);height:var(--modal-close-size);background:transparent;border:none;color:var(--modal-text-color);font-size:var(--modal-close-icon-size);cursor:pointer;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background-color .15s ease,transform .15s ease;z-index:1}.modal-close:hover{background:#00000014;transform:scale(1.05)}.modal-close:active{transform:scale(.95)}.modal-header{display:flex;align-items:center;gap:var(--modal-spacing-sm);padding:var(--modal-spacing-lg) var(--modal-spacing-lg) var(--modal-spacing-md);border-bottom:1px solid rgba(0,0,0,.1);flex-shrink:0}.modal-header .suit{width:24px;height:24px;flex-shrink:0}.modal-header h2{font-size:var(--modal-font-size-xl);font-weight:600;margin:0;line-height:1.2;word-break:break-word}.modal-body{padding:var(--modal-spacing-md) var(--modal-spacing-lg) var(--modal-spacing-lg);font-size:var(--modal-font-size-base);line-height:1.6;overflow-y:auto;flex:1;min-height:0;-webkit-overflow-scrolling:touch}.modal-body p{margin:0 0 var(--modal-spacing-md) 0}.modal-body p:last-child{margin-bottom:0}.project-links{margin-top:var(--modal-spacing-lg);padding-top:var(--modal-spacing-md);border-top:1px solid rgba(0,0,0,.1);text-align:center;font-size:var(--modal-font-size-sm)}.project-links a{color:#0056b3;text-decoration:none;font-weight:500;margin:0 var(--modal-spacing-xs);display:inline-block;padding:var(--modal-spacing-xs) var(--modal-spacing-sm);border-radius:6px;transition:background-color .15s ease}.project-links a:hover{background:#0056b31a;text-decoration:underline}@media (max-width: 768px){:root{--modal-spacing-sm: 16px;--modal-spacing-md: 20px;--modal-spacing-lg: 24px;--modal-close-size: 48px;--modal-close-icon-size: 24px}.modal{padding:0;align-items:stretch}.modal-content{max-width:100vw;max-height:100vh;border-radius:var(--modal-border-radius) var(--modal-border-radius) 0 0;margin-top:auto;animation:modal-slide-up .3s cubic-bezier(.2,.8,.2,1) forwards}.modal-header{padding:var(--modal-spacing-lg) var(--modal-spacing-md) var(--modal-spacing-md)}.modal-header h2{font-size:var(--modal-font-size-lg)}.modal-body{padding:var(--modal-spacing-md);font-size:var(--modal-font-size-sm)}.modal-close{top:var(--modal-spacing-md);right:var(--modal-spacing-md)}}@media (min-width: 769px){.modal-content{margin:var(--modal-spacing-lg)}.modal-header{padding:var(--modal-spacing-xl) var(--modal-spacing-lg) var(--modal-spacing-md)}.modal-body{padding:var(--modal-spacing-md) var(--modal-spacing-lg) var(--modal-spacing-xl)}}@media (min-width: 1200px){.modal-content{max-width:640px}}@keyframes modal-fade-in{0%{opacity:0}to{opacity:1}}@keyframes modal-fade-out{0%{opacity:1}to{opacity:0}}@keyframes modal-slide-in{0%{opacity:0;transform:scale(.95) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes modal-slide-up{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion: reduce){.modal,.modal-content,.modal-close{animation:none!important;transition:none!important}.modal-content{opacity:1;transform:none}}@media (prefers-contrast: high){:root{--modal-backdrop-color: rgba(0, 0, 0, .8);--modal-background: white;--modal-text-color: black;--modal-shadow: 0 0 0 2px black}.modal-close:hover{background:#000;color:#fff}}.bottom-bar{position:fixed;bottom:0;left:0;width:100%;background-color:#333;display:flex;justify-content:space-around;padding:10px 0;z-index:1000}.bottom-nav-item{color:#fff;background:none;border:none;font-size:16px;cursor:pointer}@media (min-width: 769px){.bottom-bar{display:none}}