:root{font-family:Segoe UI,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:#fffffff2;background-color:#0a3d23;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;overflow-x:hidden}#root{min-height:100vh}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;cursor:pointer;transition:all .2s ease}button:focus,button:focus-visible{outline:2px solid #facc15;outline-offset:2px}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#0003;border-radius:4px}::-webkit-scrollbar-thumb{background:#fff3;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffffff4d}::selection{background:#facc154d;color:#fff}*{box-sizing:border-box}:root{--color-felt: #0d5f3c;--color-felt-dark: #073d26;--color-gold: #ffd700;--color-gold-dark: #b8860b;--color-purple: #8b5cf6;--color-card-bg: #ffffff;--shadow-card: 0 4px 15px rgba(0, 0, 0, .3);--shadow-glow: 0 0 20px rgba(255, 215, 0, .4)}.app-container{min-height:100vh;background:radial-gradient(ellipse at center,#1a6b47,#0d4f2d 40%,#072a18);background-attachment:fixed;position:relative;overflow:hidden}.app-container:before{content:"";position:fixed;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.08'/%3E%3C/svg%3E");pointer-events:none;z-index:0}.app-container:after{content:"";position:fixed;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle at 30% 30%,rgba(255,215,0,.03) 0%,transparent 50%),radial-gradient(circle at 70% 70%,rgba(139,92,246,.03) 0%,transparent 50%);animation:ambientLight 20s ease-in-out infinite;pointer-events:none;z-index:0}@keyframes ambientLight{0%,to{transform:translate(0) rotate(0)}25%{transform:translate(2%,2%) rotate(5deg)}50%{transform:translate(-2%,1%) rotate(-5deg)}75%{transform:translate(1%,-2%) rotate(3deg)}}.game-layout-horizontal{display:flex;flex-direction:row;height:100vh;padding:1.5rem;gap:1.5rem;position:relative;z-index:1}.play-area{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0;padding:1rem 0;position:relative}.play-area:before{content:"";position:absolute;inset:-2px;border-radius:24px;background:linear-gradient(135deg,rgba(255,215,0,.2),transparent 50%,rgba(139,92,246,.2));z-index:-1;opacity:.5}.side-panel{width:220px;display:flex;flex-direction:column;padding:0;flex-shrink:0;animation:slideInRight .5s ease-out}@keyframes slideInRight{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}.columns-separator{display:flex;justify-content:center;align-items:center;padding:12px 20px;margin:8px 0;background:linear-gradient(90deg,transparent,rgba(255,215,0,.1),transparent);border-radius:20px;position:relative}.columns-separator:before,.columns-separator:after{content:"";position:absolute;top:50%;width:60px;height:2px;background:linear-gradient(90deg,transparent,rgba(255,215,0,.4),transparent)}.columns-separator:before{left:-70px}.columns-separator:after{right:-70px}.column-indicator{height:32px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#ffd700cc;background:#0000004d;border-radius:16px;border:1px solid rgba(255,215,0,.3);text-shadow:0 0 10px rgba(255,215,0,.5);transition:all .3s ease}.column-indicator:hover{transform:scale(1.1);background:#ffd70033}.ai-card-display{margin-top:1rem;display:flex;flex-direction:column;align-items:center;padding:1rem;background:linear-gradient(135deg,#8b5cf633,#0006);border-radius:16px;border:1px solid rgba(139,92,246,.3);animation:pulse 2s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes pulse{0%,to{opacity:1;box-shadow:0 0 #8b5cf600}50%{opacity:.9;box-shadow:0 0 20px #8b5cf64d}}@keyframes shimmer{0%{background-position:-200% center}to{background-position:200% center}}@keyframes cardDeal{0%{opacity:0;transform:translateY(-100px) rotateY(180deg) scale(.5)}60%{opacity:1;transform:translateY(10px) rotateY(0) scale(1.05)}to{transform:translateY(0) rotateY(0) scale(1)}}@keyframes cardPlace{0%{transform:scale(1.2);opacity:.7}50%{transform:scale(.95)}to{transform:scale(1);opacity:1}}@keyframes glowPulse{0%,to{box-shadow:0 0 5px #ffd7004d}50%{box-shadow:0 0 25px #ffd70099,0 0 50px #ffd7004d}}@keyframes ripple{0%{transform:scale(0);opacity:1}to{transform:scale(4);opacity:0}}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}@keyframes confetti{0%{transform:translateY(0) rotate(0);opacity:1}to{transform:translateY(100vh) rotate(720deg);opacity:0}}@keyframes rainbow{0%{filter:hue-rotate(0deg)}to{filter:hue-rotate(360deg)}}.animate-float{animation:float 3s ease-in-out infinite}.animate-card-deal{animation:cardDeal .5s cubic-bezier(.34,1.56,.64,1) forwards}.animate-card-place{animation:cardPlace .3s ease-out forwards}.animate-glow{animation:glowPulse 2s ease-in-out infinite}.animate-slide-up{animation:slideUp .4s ease-out forwards}.animate-shake{animation:shake .5s ease-in-out}.golden-particles{position:relative;overflow:visible}.golden-particles:before{content:"✦";position:absolute;top:-5px;right:-5px;font-size:12px;color:gold;animation:float 2s ease-in-out infinite,rainbow 3s linear infinite;text-shadow:0 0 10px gold}.animate-bounce{animation:bounce .5s ease-in-out}.animate-pulse{animation:pulse 1.5s ease-in-out infinite}.animate-slide-in{animation:slideIn .3s ease-out}.flex{display:flex}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.items-center{align-items:center}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-10{padding:2.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.pt-2{padding-top:.5rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.ml-1{margin-left:.25rem}.mx-4{margin-left:1rem;margin-right:1rem}.w-8{width:2rem}.w-10{width:2.5rem}.w-12{width:3rem}.w-16{width:4rem}.w-20{width:5rem}.w-full{width:100%}.h-8{height:2rem}.h-10{height:2.5rem}.h-16{height:4rem}.h-22{height:5.5rem}.h-28{height:7rem}.min-w-20{min-width:5rem}.min-h-28{min-height:7rem}.max-w-lg{max-width:32rem}.max-w-4xl{max-width:56rem}.max-h-\[90vh\]{max-height:90vh}.text-center{text-align:center}.text-left{text-align:left}.text-xs{font-size:.75rem;line-height:1rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-5xl{font-size:3rem;line-height:1}.font-medium{font-weight:500}.font-bold{font-weight:700}.leading-none{line-height:1}.tracking-wider{letter-spacing:.05em}.select-none{-webkit-user-select:none;user-select:none}.text-white{color:#fff}.text-gray-300{color:#d1d5db}.text-gray-400{color:#9ca3af}.text-gray-500{color:#6b7280}.text-gray-900{color:#111827}.text-red-300{color:#fca5a5}.text-red-400{color:#f87171}.text-red-600{color:#dc2626}.text-blue-300{color:#93c5fd}.text-blue-400{color:#60a5fa}.text-green-400{color:#4ade80}.text-yellow-200{color:#fef08a}.text-yellow-400{color:#facc15}.text-purple-400{color:#c084fc}.bg-white{background-color:#fff}.bg-black{background-color:#000}.bg-gray-500{background-color:#6b7280}.bg-gray-600{background-color:#4b5563}.bg-gray-800{background-color:#1f2937}.bg-red-600{background-color:#dc2626}.bg-blue-600{background-color:#2563eb}.bg-blue-700{background-color:#1d4ed8}.bg-blue-800{background-color:#1e40af}.bg-blue-900{background-color:#1e3a8a}.bg-blue-950{background-color:#172554}.bg-green-600{background-color:#16a34a}.bg-green-700{background-color:#15803d}.bg-purple-600{background-color:#9333ea}.bg-black\/20{background-color:#0003}.bg-black\/30{background-color:#0000004d}.bg-black\/40{background-color:#0006}.bg-black\/50{background-color:#00000080}.bg-black\/80{background-color:#000c}.bg-gray-800\/20{background-color:#1f293733}.bg-blue-900\/20{background-color:#1e3a8a33}.bg-blue-900\/30{background-color:#1e3a8a4d}.bg-red-900\/20{background-color:#7f1d1d33}.bg-red-900\/30{background-color:#7f1d1d4d}.bg-green-900\/30{background-color:#14532d4d}.bg-green-800\/40{background-color:#16653466}.bg-yellow-500\/20{background-color:#eab30833}.bg-yellow-600\/20{background-color:#ca8a0433}.bg-yellow-900\/20{background-color:#713f1233}.bg-gradient-to-b{background-image:linear-gradient(to bottom,var(--tw-gradient-stops))}.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}.from-blue-600{--tw-gradient-from: #2563eb;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, transparent)}.from-blue-800{--tw-gradient-from: #1e40af;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, transparent)}.from-purple-500{--tw-gradient-from: #a855f7;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, transparent)}.from-purple-600{--tw-gradient-from: #9333ea;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, transparent)}.from-green-600{--tw-gradient-from: #16a34a;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, transparent)}.from-gray-600{--tw-gradient-from: #4b5563;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, transparent)}.from-gray-900{--tw-gradient-from: #111827;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, transparent)}.to-blue-800{--tw-gradient-to: #1e40af}.to-blue-950{--tw-gradient-to: #172554}.to-pink-500{--tw-gradient-to: #ec4899}.to-pink-600{--tw-gradient-to: #db2777}.to-green-800{--tw-gradient-to: #166534}.to-gray-800{--tw-gradient-to: #1f2937}.to-gray-950{--tw-gradient-to: #030712}.border{border-width:1px}.border-2{border-width:2px}.border-t{border-top-width:1px}.border-b{border-bottom-width:1px}.border-dashed{border-style:dashed}.border-gray-300{border-color:#d1d5db}.border-gray-500{border-color:#6b7280}.border-gray-600{border-color:#4b5563}.border-gray-700{border-color:#374151}.border-gray-800{border-color:#1f2937}.border-blue-400{border-color:#60a5fa}.border-blue-600{border-color:#2563eb}.border-blue-700{border-color:#1d4ed8}.border-blue-800{border-color:#1e40af}.border-green-400{border-color:#4ade80}.border-green-800{border-color:#166534}.border-red-700{border-color:#b91c1c}.border-purple-300{border-color:#d8b4fe}.border-purple-400{border-color:#c084fc}.border-yellow-400{border-color:#facc15}.border-yellow-500\/50{border-color:#eab30880}.border-green-500\/50{border-color:#22c55e80}.rounded{border-radius:.25rem}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-2xl{border-radius:1rem}.rounded-3xl{border-radius:1.5rem}.rounded-full{border-radius:9999px}.shadow-lg{box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a}.shadow-xl{box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.shadow-2xl{box-shadow:0 25px 50px -12px #00000040}.ring-1{box-shadow:0 0 0 1px var(--ring-color, #60a5fa)}.ring-2{box-shadow:0 0 0 2px var(--ring-color, #60a5fa)}.ring-4{box-shadow:0 0 0 4px var(--ring-color, #60a5fa)}.ring-yellow-400{--ring-color: #facc15;box-shadow:0 0 0 calc(var(--ring-width, 2px)) #facc15}.ring-purple-500{--ring-color: #a855f7;box-shadow:0 0 0 calc(var(--ring-width, 4px)) #a855f7}.ring-green-500\/50{--ring-color: rgba(34, 197, 94, .5);box-shadow:0 0 0 1px #22c55e80}.transform{transform:translate(var(--tw-translate-x, 0)) translateY(var(--tw-translate-y, 0)) rotate(var(--tw-rotate, 0))}.scale-105{transform:scale(1.05)}.scale-110{transform:scale(1.1)}.-rotate-12{transform:rotate(-12deg)}.-rotate-6{transform:rotate(-6deg)}.rotate-6{transform:rotate(6deg)}.rotate-12{transform:rotate(12deg)}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.cursor-pointer{cursor:pointer}.cursor-not-allowed{cursor:not-allowed}.cursor-default{cursor:default}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.opacity-70{opacity:.7}.overflow-auto{overflow:auto}.overflow-x-auto{overflow-x:auto}.backdrop-blur-sm{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.backdrop-blur-md{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.inset-0{inset:0}.-bottom-1{bottom:-.25rem}.-bottom-2{bottom:-.5rem}.-right-1{right:-.25rem}.-right-2{right:-.5rem}.-z-10{z-index:-10}.-z-20{z-index:-20}.z-50{z-index:50}.z-1{z-index:1}.space-y-1>*+*{margin-top:.25rem}.space-y-2>*+*{margin-top:.5rem}.space-y-4>*+*{margin-top:1rem}.grid{display:grid}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.hover\:scale-105:hover{transform:scale(1.05)}.hover\:shadow-lg:hover{box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a}.hover\:shadow-xl:hover{box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.hover\:shadow-2xl:hover{box-shadow:0 25px 50px -12px #00000040}.hover\:border-green-400:hover{border-color:#4ade80}.hover\:border-green-300:hover{border-color:#86efac}.hover\:bg-green-700:hover{background-color:#15803d}.hover\:bg-gray-700:hover{background-color:#374151}.hover\:bg-blue-700:hover{background-color:#1d4ed8}.hover\:bg-green-800\/40:hover{background-color:#16653466}.hover\:from-blue-500:hover{--tw-gradient-from: #3b82f6}.hover\:from-purple-500:hover{--tw-gradient-from: #a855f7}.hover\:from-green-500:hover{--tw-gradient-from: #22c55e}.hover\:from-gray-500:hover{--tw-gradient-from: #6b7280}.hover\:to-blue-700:hover{--tw-gradient-to: #1d4ed8}.hover\:to-pink-500:hover{--tw-gradient-to: #ec4899}.hover\:to-green-700:hover{--tw-gradient-to: #15803d}.hover\:to-gray-700:hover{--tw-gradient-to: #374151}@media(min-width:768px){.game-layout{padding:2rem}}.app-container-wide{min-height:100vh;height:100vh;width:100vw;background:radial-gradient(ellipse at center,#1a6b47,#0d4f2d 40%,#072a18);background-attachment:fixed;position:relative;overflow:hidden;display:flex;flex-direction:column}.app-container-wide:before{content:"";position:fixed;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.08'/%3E%3C/svg%3E");pointer-events:none;z-index:0}.player-info-panel{width:160px;min-width:160px;display:flex;flex-direction:column;gap:.75rem;padding-top:1rem;flex-shrink:0}.player-info-panel.left{align-items:flex-start}.player-info-panel.right{align-items:flex-end}.player-info-card{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px;background:linear-gradient(135deg,#0006,#0009);border-radius:16px;border:1px solid rgba(255,255,255,.1);width:100%}.player-avatar{width:50px;height:50px;border-radius:50%;background:linear-gradient(135deg,#374151,#1f2937);display:flex;align-items:center;justify-content:center;font-size:24px;border:2px solid rgba(255,255,255,.2);transition:all .3s ease}.player-avatar.active{border-color:gold;box-shadow:0 0 20px #ffd70066;animation:pulseGlow 2s ease-in-out infinite}@keyframes pulseGlow{0%,to{box-shadow:0 0 15px #ffd7004d}50%{box-shadow:0 0 25px #ffd70099}}.player-details{text-align:center}.player-name{color:#fff;font-size:14px;font-weight:700;margin:0}.turn-badge{display:inline-block;margin-top:4px;padding:4px 10px;background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;font-size:11px;font-weight:600;border-radius:10px;animation:pulseBadge 1.5s ease-in-out infinite}.turn-badge.ai{background:linear-gradient(135deg,#a855f7,#7c3aed)}@keyframes pulseBadge{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.joker-section{display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px;background:#0000004d;border-radius:12px;width:100%}.section-label{font-size:11px;color:#ffffff80;text-transform:uppercase;letter-spacing:.5px}.joker-display{position:relative}.joker-mini{width:56px;height:78px;border-radius:8px;background:linear-gradient(165deg,#fff,#f5f5f5);border:2px solid #a855f7;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;transition:all .3s ease;box-shadow:0 4px 15px #a855f74d}.joker-mini.clickable{cursor:pointer;animation:jokerPulse 2s ease-in-out infinite}.joker-mini.clickable:hover{transform:scale(1.1) translateY(-4px);box-shadow:0 8px 25px #a855f780}@keyframes jokerPulse{0%,to{box-shadow:0 4px 15px #a855f74d}50%{box-shadow:0 4px 25px #a855f799}}.joker-suit{font-size:22px;line-height:1}.joker-rank{font-size:14px;font-weight:800;color:inherit}.joker-badge-mini{position:absolute;top:-6px;right:-6px;font-size:14px;background:linear-gradient(135deg,#a855f7,#7c3aed);border-radius:50%;width:20px;height:20px;display:flex;align-items:center;justify-content:center}.joker-mini.opponent{background:linear-gradient(135deg,#1e3a5f,#0f172a);border-color:#3b82f6}.joker-hidden{font-size:24px;color:#3b82f680}.joker-used{width:56px;height:78px;border-radius:8px;background:#0000004d;border:1px dashed rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;font-size:10px;color:#ffffff4d}.joker-hint{font-size:10px;color:#a855f7;animation:blink 1.5s ease-in-out infinite}.joker-section-visible{display:flex;flex-direction:column;align-items:center;gap:10px;padding:15px;background:linear-gradient(135deg,#a855f726,#8b5cf633);border-radius:16px;border:2px solid rgba(168,85,247,.4);width:100%;box-shadow:0 0 20px #a855f733}.joker-display-large{position:relative}.joker-card-visible{width:70px;height:98px;border-radius:10px;background:linear-gradient(165deg,#fff,#f8f8f8 30%,#f0f0f0);border:3px solid #a855f7;box-shadow:0 4px 20px #a855f766,0 0 30px #a855f733,inset 0 1px #fffc;position:relative;transition:all .3s ease;overflow:hidden}.joker-card-visible.clickable{cursor:pointer}.joker-card-visible.clickable:hover{transform:scale(1.1) translateY(-5px);box-shadow:0 8px 30px #a855f780,0 0 40px #a855f74d}.joker-card-visible.pulse{animation:jokerCardPulse 2s ease-in-out infinite}@keyframes jokerCardPulse{0%,to{box-shadow:0 4px 20px #a855f766,0 0 30px #a855f733}50%{box-shadow:0 4px 30px #a855f799,0 0 50px #a855f766}}.joker-card-inner{position:relative;width:100%;height:100%}.joker-corner{position:absolute;display:flex;flex-direction:column;align-items:center;line-height:1;color:var(--joker-color)}.joker-corner.top-left{top:5px;left:6px}.joker-corner.bottom-right{bottom:5px;right:6px;transform:rotate(180deg)}.joker-card-visible .joker-rank{font-size:14px;font-weight:800;font-family:Georgia,serif}.joker-suit-symbol{font-size:12px;margin-top:-1px}.joker-center{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.joker-main-suit{font-size:34px;color:var(--joker-color);filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}.joker-badge-floating{position:absolute;top:-8px;right:-8px;width:26px;height:26px;background:linear-gradient(135deg,#a855f7,#7c3aed);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;box-shadow:0 2px 10px #a855f780;animation:badgeBounce 2s ease-in-out infinite}@keyframes badgeBounce{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.joker-used-large{width:70px;height:98px;border-radius:10px;background:#0006;border:2px dashed rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;font-size:11px;color:#ffffff80;text-align:center}.joker-hint-visible{font-size:10px;color:#c4b5fd;text-align:center;animation:blink 1.5s ease-in-out infinite;background:#a855f733;padding:4px 8px;border-radius:8px}@keyframes blink{0%,to{opacity:1}50%{opacity:.5}}.drawn-card-section{display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px;background:linear-gradient(135deg,#22c55e1a,#0000004d);border-radius:12px;border:1px solid rgba(34,197,94,.3);width:100%}.game-controls-mini{display:flex;gap:8px;margin-top:auto;padding-bottom:1rem}.control-btn{width:40px;height:40px;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:#0006;color:#fff;font-size:16px;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center}.control-btn:hover{background:#ffffff1a;transform:scale(1.1)}.card-stack{position:relative;display:flex;flex-direction:column;align-items:center}.stacked-card{transition:all .3s ease}.stacked-card:hover{z-index:100!important}.line-playable{cursor:pointer}.line-playable:hover{transform:scale(1.02)}.empty-slot-overlay{position:absolute;left:50%;transform:translate(-50%)}.center-strip{display:flex;align-items:center;justify-content:center;gap:1.5rem;padding:4px 15px;margin:2px 0;flex-shrink:0}.columns-separator-wide{display:flex;justify-content:center;align-items:center;padding:4px 10px;background:linear-gradient(90deg,transparent,rgba(255,215,0,.15),transparent);border-radius:10px}.column-indicator{height:24px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#ffd700b3;background:#00000040;border-radius:12px;border:1px solid rgba(255,215,0,.25)}.deck-mini{display:flex;flex-direction:column;align-items:center;gap:2px}.deck-mini.invisible{visibility:hidden}.deck-visual{width:32px;height:44px;border-radius:6px;background:linear-gradient(135deg,#1e40af,#172554);border:1.5px solid #3b82f6;display:flex;align-items:center;justify-content:center;box-shadow:1.5px 1.5px #172554,3px 3px #0f172a}.deck-icon{font-size:14px}.deck-count{font-size:9px;font-weight:700;color:#fff;padding:1px 6px;background:#00000080;border-radius:6px}.game-message-bottom{position:fixed;bottom:15px;left:50%;transform:translate(-50%);padding:10px 20px;background:linear-gradient(135deg,#000c,#000000e6);border-radius:10px;border:1px solid rgba(255,255,255,.1);color:#fff;font-size:13px;font-weight:500;z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:slideUp .3s ease-out}@keyframes slideUp{0%{opacity:0;transform:translate(-50%) translateY(20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.game-layout-schema{flex:1;display:flex;flex-direction:row;justify-content:center;align-items:stretch;padding:15px 20px;position:relative;z-index:1;height:100vh;overflow:hidden;gap:20px}.left-column{width:180px;min-width:180px;display:flex;flex-direction:column;gap:15px;padding:10px 0;flex-shrink:0}.panel-label{display:block;font-size:11px;font-weight:700;color:#fff9;text-transform:uppercase;letter-spacing:1px;margin-bottom:10px;text-align:center}.card-to-place-panel{background:linear-gradient(145deg,#22c55e26,#0009);border-radius:16px;border:2px solid rgba(34,197,94,.4);padding:15px;flex:1;display:flex;flex-direction:column;align-items:center;box-shadow:0 4px 20px #22c55e26}.card-display-area{flex:1;display:flex;align-items:center;justify-content:center;width:100%}.waiting-card{width:100px;height:140px;border-radius:12px;border:2px dashed rgba(255,255,255,.2);background:#0000004d;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}.waiting-icon{font-size:40px;opacity:.3}.waiting-text{font-size:11px;color:#ffffff4d}.place-hint{font-size:11px;color:#22c55e;text-align:center;animation:blink 1.5s ease-in-out infinite;margin-top:10px}.joker-section-left{background:linear-gradient(145deg,#a855f726,#0009);border-radius:16px;border:2px solid rgba(168,85,247,.4);padding:15px;display:flex;flex-direction:column;align-items:center;box-shadow:0 4px 20px #a855f726}.joker-display-area{display:flex;justify-content:center;padding:10px 0}.joker-card-schema{width:80px;height:112px;border-radius:12px;background:linear-gradient(165deg,#fff,#f8f8f8 30%,#f0f0f0);border:3px solid #a855f7;box-shadow:0 4px 20px #a855f766,0 0 30px #a855f733,inset 0 1px #fffc;position:relative;transition:all .3s ease;overflow:hidden}.joker-card-schema.clickable{cursor:pointer}.joker-card-schema.clickable:hover{transform:scale(1.08) translateY(-5px);box-shadow:0 8px 30px #a855f780,0 0 40px #a855f74d}.joker-card-schema.pulse{animation:jokerCardPulse 2s ease-in-out infinite}.joker-card-schema .joker-rank{font-size:16px;font-weight:800;font-family:Georgia,serif}.joker-card-schema .joker-suit-symbol{font-size:14px}.joker-card-schema .joker-main-suit{font-size:40px}.joker-empty{width:80px;height:112px;border-radius:12px;background:#0006;border:2px dashed rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;font-size:11px;color:#fff6;text-align:center}.joker-click-hint{font-size:10px;color:#c4b5fd;text-align:center;animation:blink 1.5s ease-in-out infinite;background:#a855f733;padding:4px 10px;border-radius:8px;margin-top:8px}.controls-section{background:#0006;border-radius:16px;border:1px solid rgba(255,255,255,.1);padding:12px}.controls-buttons{display:flex;justify-content:center;gap:10px}.ctrl-btn{width:45px;height:45px;border-radius:12px;border:1px solid rgba(255,255,255,.15);background:#ffffff0d;color:#fff;font-size:18px;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center}.ctrl-btn:hover{background:#ffffff26;transform:scale(1.1);border-color:#ffd70080}.deck-section{background:linear-gradient(145deg,#3b82f626,#00000080);border-radius:16px;border:2px solid rgba(59,130,246,.3);padding:12px;display:flex;flex-direction:column;align-items:center}.deck-display{display:flex;flex-direction:column;align-items:center;gap:8px}.deck-cards-stack{width:50px;height:70px;border-radius:10px;background:linear-gradient(135deg,#1e40af,#172554);border:2px solid #3b82f6;display:flex;align-items:center;justify-content:center;font-size:24px;box-shadow:3px 3px #172554,6px 6px #0f172a}.deck-count{font-size:18px;font-weight:800;color:#60a5fa;background:#00000080;padding:4px 12px;border-radius:10px;border:1px solid rgba(59,130,246,.3)}.center-column{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0;padding:10px 0;height:100%;overflow:hidden}.board-section{display:flex;justify-content:center;align-items:center}.board-section.opponent,.board-section.player{width:100%;display:flex;justify-content:center;align-items:center}.board-section>div{margin:0 auto}.columns-strip{display:flex;align-items:center;justify-content:center;padding:8px 0;margin:5px 0;flex-shrink:0;width:100%}.column-numbers{display:flex;justify-content:center;align-items:center;padding:6px 0;background:transparent;border-radius:12px}.col-number{height:28px;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#ffd700cc;background:#0000004d;border-radius:14px;border:1px solid rgba(255,215,0,.3);text-shadow:0 0 10px rgba(255,215,0,.5)}.deck-indicator{display:flex;flex-direction:column;align-items:center;gap:4px}.deck-indicator.invisible{visibility:hidden}.deck-cards{width:36px;height:50px;border-radius:8px;background:linear-gradient(135deg,#1e40af,#172554);border:2px solid #3b82f6;display:flex;align-items:center;justify-content:center;font-size:16px;box-shadow:2px 2px #172554,4px 4px #0f172a}.deck-number{font-size:10px;font-weight:700;color:#fff;padding:2px 8px;background:#00000080;border-radius:8px}.right-column{width:180px;min-width:180px;display:flex;flex-direction:column;padding:10px 0;flex-shrink:0}.scores-panel{background:linear-gradient(145deg,#ffd7001a,#0009);border-radius:16px;border:2px solid rgba(255,215,0,.3);padding:15px;box-shadow:0 4px 20px #ffd7001a}.versus-container{display:flex;flex-direction:column;align-items:center;gap:10px}.player-score-card{width:100%;padding:15px;background:#ffffff0d;border-radius:12px;border:2px solid transparent;display:flex;flex-direction:column;align-items:center;gap:8px;transition:all .3s ease}.player-score-card.active{border-color:#ffd70080;background:#ffd7001a;box-shadow:0 0 20px #ffd70033}.player-avatar-big{width:50px;height:50px;border-radius:50%;background:linear-gradient(135deg,#374151,#1f2937);display:flex;align-items:center;justify-content:center;font-size:26px;border:2px solid rgba(255,255,255,.2)}.player-score-card.active .player-avatar-big{border-color:gold;box-shadow:0 0 15px #ffd70066}.player-name-score{font-size:14px;font-weight:700;color:#fff}.turn-indicator{font-size:11px;color:#22c55e;font-weight:600;padding:4px 10px;background:#22c55e33;border-radius:10px;animation:pulseBadge 1.5s ease-in-out infinite}.turn-indicator.ai{color:#a855f7;background:#a855f733}.joker-info{font-size:10px;color:#ffffff80}.vs-badge{font-size:18px;font-weight:900;color:gold;text-shadow:0 0 10px rgba(255,215,0,.5);padding:8px 20px;background:#0006;border-radius:20px;border:2px solid rgba(255,215,0,.3)}.game-layout-wide{flex:1;display:flex;flex-direction:row;padding:1rem 1.5rem;gap:1.5rem;position:relative;z-index:1;height:100vh;overflow:hidden}
