@import "https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700&family=Inter:wght@400;500;600&display=swap";:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-primary:#0a0a0f;--bg-secondary:#12121a;--bg-tertiary:#1a1a24;--bg-card:#252530;--gold-primary:#d4af37;--gold-secondary:#b8962e;--gold-light:#e5c048;--text-primary:#f0ebe0;--text-secondary:#c0bbb0;--text-muted:#888;--border-subtle:#ffffff0d;--border-gold:#d4af374d;--purple-primary:#9b59b6;--purple-secondary:#8e44ad;--green-primary:#2ecc71;--green-secondary:#27ae60;--red-primary:#e74c3c;--red-secondary:#c0392b}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}button,.card,.square,a{touch-action:manipulation}html{background:#0d0d14;height:100%;margin:0;padding:0;font-size:16px;overflow:hidden}body{background:linear-gradient(145deg, var(--bg-primary) 0%, var(--bg-secondary) 50%, #0d0d14 100%);width:100vw;height:100dvh;min-height:100vh;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px);justify-content:center;align-items:center;margin:0;font-family:Inter,sans-serif;display:flex;overflow:hidden}body:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(at 20% 20%,#d4af3708 0%,#0000 50%),radial-gradient(at 80% 80%,#d4af3705 0%,#0000 50%);width:100%;height:100%;position:fixed;top:0;left:0}#app{z-index:1;flex-direction:column;justify-content:center;align-items:center;gap:.5rem;width:90%;max-width:1400px;height:90vh;padding:.5rem;display:flex;position:relative}#game-container{flex:none;justify-content:center;align-items:center;gap:1rem;display:flex}.player-column{flex-direction:column;flex-shrink:0;align-items:center;gap:8px;width:260px;min-width:260px;max-width:260px;display:flex;transform:translateY(5%)}.player-panel{background:linear-gradient(145deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%);border:1px solid var(--border-gold);border-radius:12px;flex-direction:column;flex:1;width:260px;min-width:260px;max-width:260px;height:auto;min-height:0;max-height:420px;display:flex;overflow:hidden;box-shadow:0 8px 24px #00000080,0 0 20px #d4af370d,inset 0 1px #ffffff0d}.panel-header{background:linear-gradient(135deg, var(--gold-primary) 0%, var(--gold-secondary) 100%);text-align:center;flex-shrink:0;padding:8px 12px}.panel-title{color:var(--bg-primary);letter-spacing:.1em;text-transform:uppercase;font-family:Cinzel,serif;font-size:14px;font-weight:700}.panel-captured{border-bottom:1px solid var(--border-subtle);flex-shrink:0;padding:8px}.captured-label,.cards-label{color:var(--gold-primary);letter-spacing:.1em;text-transform:uppercase;text-shadow:0 0 6px #d4af374d;margin-bottom:6px;font-family:Cinzel,serif;font-size:10px;font-weight:600;display:block}.panel-cards{border:1px solid var(--border-subtle);background:linear-gradient(#14141e99 0%,#0f0f1666 100%);border-radius:8px;flex-direction:column;flex:1;min-height:0;padding:8px;display:flex;overflow-y:auto}.panel-cards::-webkit-scrollbar{width:6px}.panel-cards::-webkit-scrollbar-track{background:#0000004d;border-radius:10px;margin:4px 0}.panel-cards::-webkit-scrollbar-thumb{background:linear-gradient(135deg, var(--gold-primary) 0%, var(--gold-secondary) 100%);border-radius:10px;box-shadow:0 0 4px #d4af3780}.panel-cards::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg, var(--gold-light) 0%, var(--gold-primary) 100%);box-shadow:0 0 8px #d4af37cc}#center-area{flex-direction:column;flex-shrink:0;align-items:center;gap:6px;display:flex;position:relative}#board{touch-action:none;box-shadow:0 0 0 1px var(--border-gold), 0 16px 48px #000c, 0 0 80px #d4af370d, inset 0 0 60px #0000004d;background:var(--bg-tertiary);border:3px solid #2a2a3a;border-radius:6px;flex-shrink:0;grid-template-rows:repeat(8,50px);grid-template-columns:repeat(8,50px);display:grid;overflow:hidden}.square{width:50px;height:50px;transition:all .2s;position:relative}.light{background:linear-gradient(135deg,#e8dcc4 0%,#d4c4a8 100%)}.dark{background:linear-gradient(135deg,#7a6a52 0%,#5c4d3a 100%)}.piece{object-fit:contain;cursor:pointer;-webkit-user-select:none;user-select:none;z-index:5;pointer-events:none;justify-content:center;align-items:center;width:80%;height:80%;margin:auto;font-size:36px;line-height:1;transition:none;display:block;position:relative}.piece.sliding{z-index:1000;pointer-events:none;width:60px;height:60px;transition:left .15s,top .15s;position:fixed}.piece:hover{transform:scale(1.08)}.white-piece{color:#f5f0e6;filter:drop-shadow(0 .125rem .25rem #0009)drop-shadow(0 0 .5rem #ffffff1a)}.black-piece{color:#1a1a1a;filter:drop-shadow(0 .125rem .25rem #0006)drop-shadow(0 0 .0625rem #fff3)}.selected{animation:1.5s ease-in-out infinite selectedPulse;box-shadow:inset 0 0 1.25rem #ffd70066,0 0 1.25rem #d4af374d;background:linear-gradient(135deg, var(--gold-primary) 0%, #c9a227 100%)!important}@keyframes selectedPulse{0%,to{box-shadow:inset 0 0 1.25rem #ffd70066,0 0 1.25rem #d4af374d}50%{box-shadow:inset 0 0 1.875rem #ffd70099,0 0 1.875rem #d4af3780}}.legal{position:relative}.legal:not(:has(.piece)):after{content:"";background:radial-gradient(circle,#d4af37b3 0%,#d4af374d 100%);border-radius:50%;width:1.375rem;height:1.375rem;animation:2s ease-in-out infinite legalPulse;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 .75rem #d4af3780}@keyframes legalPulse{0%,to{opacity:.8;transform:translate(-50%,-50%)scale(1)}50%{opacity:1;transform:translate(-50%,-50%)scale(1.1)}}.legal:has(.piece):after{content:"";border:.1875rem solid #d4af3799;border-radius:50%;animation:1.5s ease-in-out infinite capturePulse;position:absolute;inset:.25rem;box-shadow:inset 0 0 .9375rem #d4af3733,0 0 .9375rem #d4af374d}@keyframes capturePulse{0%,to{border-color:#d4af3799}50%{border-color:#d4af37e6}}.last-move{border:.0625rem solid #64d2b980;box-shadow:inset 0 0 1.25rem #64d2b94d,0 0 .5rem #64d2b933;background:linear-gradient(135deg,#64d2b966,#64d2b940)!important}.in-check{animation:.8s ease-in-out infinite checkPulseSquare;box-shadow:inset 0 0 1.25rem #ff000080,0 0 1.5625rem #dc354566;background:linear-gradient(135deg,#dc3545b3,#b41e2dcc)!important}@keyframes checkPulseSquare{0%,to{box-shadow:inset 0 0 1.25rem #ff000080,0 0 1.5625rem #dc354566}50%{box-shadow:inset 0 0 1.875rem #ff0000b3,0 0 2.1875rem #dc354599}}#turn-indicator{text-align:center;color:var(--gold-primary);letter-spacing:2px;text-transform:uppercase;text-shadow:0 0 16px #d4af374d;flex-shrink:0;font-family:Cinzel,serif;font-size:14px;font-weight:600}#game-overlay{-webkit-backdrop-filter:blur(.5rem);backdrop-filter:blur(.5rem);z-index:10;background:#000000d9;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#overlay-box{background:linear-gradient(145deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%);text-align:center;border:1px solid var(--border-gold);border-radius:1rem;padding:3rem 4rem;box-shadow:0 1.5625rem 5rem #000c,0 0 3.75rem #d4af371a,inset 0 1px #ffffff0d}#overlay-message{color:var(--text-primary);text-shadow:0 0 1.875rem #d4af374d;margin-bottom:1.75rem;font-family:Cinzel,serif;font-size:1.625rem;font-weight:600}#restart-btn{background:linear-gradient(135deg, var(--gold-primary) 0%, var(--gold-secondary) 100%);color:var(--bg-primary);letter-spacing:.0625em;text-transform:uppercase;cursor:pointer;border:none;border-radius:.5rem;padding:.875rem 2.5rem;font-family:Cinzel,serif;font-size:.9375rem;font-weight:600;transition:all .3s;box-shadow:0 .25rem 1.25rem #d4af374d}#restart-btn:hover{background:linear-gradient(135deg, var(--gold-light) 0%, #c9a73f 100%);transform:translateY(-.125rem);box-shadow:0 .5rem 1.875rem #d4af3766}#promotion-modal{background:linear-gradient(145deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%);z-index:20;border:1px solid var(--border-gold);text-align:center;border-radius:1rem;padding:2rem 2.5rem;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 1.5625rem 5rem #000c,0 0 3.75rem #d4af371a}#promotion-title{color:var(--gold-primary);letter-spacing:.0625em;text-transform:uppercase;margin-bottom:1.5rem;font-family:Cinzel,serif;font-size:1.125rem;font-weight:600}#promotion-choices{justify-content:center;gap:1rem;display:flex}.promotion-btn{cursor:pointer;background:#2c3e50;border:2px solid #555;border-radius:8px;justify-content:center;align-items:center;width:56px;height:56px;padding:4px;transition:border-color .15s,transform .15s;display:flex}.promotion-btn:hover{border-color:#f1c40f;transform:scale(1.1)}.hidden{display:none!important}.hand{grid-template-columns:repeat(3,70px);place-content:flex-start center;gap:6px;min-height:70px;padding:6px;display:grid}.card{cursor:pointer;-webkit-user-select:none;user-select:none;background:0 0;border:none;border-radius:10px;flex-shrink:0;width:70px;height:105px;padding:0;transition:transform .15s,box-shadow .15s;position:relative;overflow:hidden}.card:before{content:"";pointer-events:none;border:1px solid #d4af3726;border-radius:4px;position:absolute;inset:3px}.card:hover{transform:translateY(-8px);box-shadow:0 8px 20px #0006}.card.selected-card{border-radius:10px;outline:2px solid #f1c40f;transform:translateY(-10px);box-shadow:0 0 14px #f1c40f,0 8px 20px #0006}@keyframes cardGlow{0%,to{box-shadow:0 0 20px #d4af3799,0 12px 28px #0006}50%{box-shadow:0 0 32px #d4af37cc,0 12px 28px #0006}}.card.red-card{color:var(--red-secondary)}.card.black-card{color:#1a1a2e}.card.joker-card{color:var(--purple-secondary);background:linear-gradient(145deg,#f8f0ff 0%,#e8d8f0 100%);border-color:#8e44ad66;font-size:10px}.card.joker-card:hover{border-color:var(--purple-secondary);box-shadow:0 12px 28px #0006,0 0 20px #8e44ad66}.card.face-down{cursor:default}.card.face-down:before{border-color:#d4af371a}.card.face-down:after{content:"";background:radial-gradient(circle,#d4af374d 0%,#0000 70%);border-radius:50%;width:20px;height:20px;position:absolute}.card.face-down:hover{box-shadow:none;transform:none}.card-rank{font-size:14px;font-weight:700;line-height:1}.card-suit{margin-top:2px;font-size:11px}#mode-chooser{border:1px solid var(--border-gold);z-index:100;background:#0f0f16f2;border-radius:8px;justify-content:center;gap:8px;padding:10px 14px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 8px 24px #0009}#mode-chooser button{cursor:pointer;text-transform:uppercase;letter-spacing:.5px;border:none;border-radius:4px;padding:6px 14px;font-family:Inter,sans-serif;font-size:11px;font-weight:600;transition:all .2s}#btn-normal,#btn-magic{cursor:pointer;text-transform:uppercase;letter-spacing:1px;border:none;border-radius:6px;padding:6px 14px;font-family:Cinzel,serif;font-size:11px;font-weight:700;transition:all .2s;box-shadow:0 2px 6px #0000004d,inset 0 1px #ffffff0d}#btn-normal{color:#8bc34a;background:linear-gradient(135deg,#1a3a2a 0%,#0f2a1e 100%);border:1px solid #8bc34a4d}#btn-normal:hover{color:#a5d6a7;background:linear-gradient(135deg,#2a5a3a 0%,#1a3a2a 100%);border-color:#8bc34a99;transform:translateY(-2px);box-shadow:0 4px 12px #0006,0 0 12px #8bc34a4d}#btn-magic{color:#bb8af0;background:linear-gradient(135deg,#2a1a3a 0%,#1a0f2a 100%);border:1px solid #9b59b64d}#btn-magic:hover{color:#d4b8ff;background:linear-gradient(135deg,#3a2a5a 0%,#2a1a3a 100%);border-color:#9b59b699;transform:translateY(-2px);box-shadow:0 4px 12px #0006,0 0 12px #9b59b64d}#btn-normal:active,#btn-magic:active{transform:translateY(0)}#card-info{background:linear-gradient(145deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%);border:1px solid var(--border-gold);border-radius:10px;flex-shrink:0;justify-content:center;align-items:flex-start;gap:24px;padding:10px 20px;display:flex;box-shadow:0 6px 20px #00000080,0 0 12px #d4af370d}#discard-pile,#deck-count-box{flex-direction:column;align-items:center;gap:6px;display:flex}#discard-label,#deck-count-label{color:var(--gold-primary);letter-spacing:1px;text-transform:uppercase;text-shadow:0 0 6px #d4af374d;font-family:Cinzel,serif;font-size:10px;font-weight:600}#discard-top{border:2px dashed var(--border-gold);width:46px;height:64px;color:var(--text-muted);background:#14141e99;border-radius:6px;flex-direction:column;justify-content:center;align-items:center;font-size:11px;font-weight:600;display:flex;overflow:hidden}#deck-count{border:2px solid var(--border-gold);width:46px;height:64px;color:var(--gold-primary);text-shadow:0 0 8px #d4af3780;background:repeating-linear-gradient(45deg,#1a1a2e 0 4px,#252538 4px 8px);border-radius:6px;justify-content:center;align-items:center;font-family:Cinzel,serif;font-size:14px;font-weight:700;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 12px #0000004d}#discard-top img,#deck-count img{object-fit:cover;border-radius:4px;width:100%;height:100%;display:block}#deck-count .deck-size-badge{min-width:16px;height:16px;color:var(--gold-primary);text-align:center;text-shadow:none;pointer-events:none;background:#08080cd9;border:1px solid #d4af37d9;border-radius:999px;padding:0 4px;font-size:10px;line-height:14px;position:absolute;bottom:2px;right:2px}#phase-indicator{text-align:center;color:var(--gold-primary);letter-spacing:1px;text-transform:uppercase;text-shadow:0 0 12px #d4af3766;min-height:20px;padding:6px 12px;font-family:Cinzel,serif;font-size:11px;font-weight:600}.square.ace-swap:after{content:"";pointer-events:none;z-index:10;background:radial-gradient(circle,#e74c3c99 0%,#e74c3c33 70%);border-radius:.25rem;animation:1.2s ease-in-out infinite magicPulse;position:absolute;inset:0}.square.ace-shift:after{content:"";pointer-events:none;z-index:10;background:radial-gradient(circle,#3498db99 0%,#3498db33 70%);border-radius:.25rem;animation:1.2s ease-in-out infinite magicPulse;position:absolute;inset:0}@keyframes magicPulse{0%,to{opacity:.8}50%{opacity:1}}#joker-chooser{z-index:100;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#joker-box{background:linear-gradient(145deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%);text-align:center;border:2px solid #8e44ad80;border-radius:8px;padding:10px 14px;box-shadow:0 8px 24px #0009,0 0 20px #8e44ad26}#joker-title{color:var(--purple-primary);letter-spacing:1px;text-shadow:0 0 12px #8e44ad66;margin-bottom:8px;font-family:Cinzel,serif;font-size:12px;font-weight:700}#joker-options{justify-content:center;gap:8px;display:flex}#joker-options button{cursor:pointer;border:none;border-radius:4px;padding:6px 12px;font-family:Inter,sans-serif;font-size:10px;font-weight:600;transition:all .2s}#btn-eliminate{color:#e67e22;cursor:pointer;text-transform:uppercase;letter-spacing:1.5px;background:linear-gradient(135deg,#3a1a1a 0%,#2a0f0f 100%);border:1px solid #e67e2266;border-radius:8px;padding:8px 16px;font-family:Cinzel,serif;font-size:11px;font-weight:700;transition:all .2s;box-shadow:0 3px 10px #0006,inset 0 1px #ffffff0d}#btn-eliminate:hover{color:#f39c12;background:linear-gradient(135deg,#5a2a1a 0%,#3a1a0f 100%);border-color:#e67e22b3;transform:translateY(-2px);box-shadow:0 6px 18px #0006,0 0 14px #e67e2266}#btn-eliminate:active{transform:translateY(0)}#btn-return{color:#2ecc71;cursor:pointer;text-transform:uppercase;letter-spacing:1.5px;background:linear-gradient(135deg,#1a3a2a 0%,#0f2a1e 100%);border:1px solid #2ecc7166;border-radius:8px;padding:8px 16px;font-family:Cinzel,serif;font-size:11px;font-weight:700;transition:all .2s;box-shadow:0 3px 10px #0006,inset 0 1px #ffffff0d}#btn-return:hover{color:#58d68d;background:linear-gradient(135deg,#2a5a3a 0%,#1a3a2a 100%);border-color:#2ecc71b3;transform:translateY(-2px);box-shadow:0 6px 18px #0006,0 0 14px #2ecc7166}#btn-return:active{transform:translateY(0)}#joker-return-panel{z-index:100;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#joker-return-box{background:linear-gradient(145deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%);text-align:center;border:2px solid #27ae6080;border-radius:8px;padding:10px 14px;box-shadow:0 8px 24px #0009,0 0 20px #27ae6026}#joker-return-box p{color:var(--green-primary);letter-spacing:1px;text-shadow:0 0 10px #2ecc7166;margin-bottom:8px;font-family:Cinzel,serif;font-size:11px;font-weight:700}#joker-return-choices{flex-wrap:wrap;justify-content:center;gap:6px;margin-bottom:8px;display:flex}.return-piece-btn{width:42px;height:42px;color:var(--text-primary);cursor:pointer;background:linear-gradient(145deg,#1a1a24 0%,#12121a 100%);border:1px solid #2ecc714d;border-radius:8px;justify-content:center;align-items:center;font-size:22px;transition:all .2s;display:flex;box-shadow:0 2px 6px #0000004d,inset 0 1px #ffffff08}.return-piece-btn:hover{background:linear-gradient(145deg,#252530 0%,#1a1a24 100%);border-color:#2ecc71b3;transform:scale(1.08);box-shadow:0 4px 12px #0006,0 0 12px #2ecc714d}.return-piece-btn.selected-return{border-color:var(--gold-primary);background:linear-gradient(145deg,#2a2a3a 0%,#1f1f2a 100%);animation:1.5s ease-in-out infinite cardGlow;box-shadow:0 0 18px #d4af3780,inset 0 0 8px #d4af3733}#btn-cancel-return{color:var(--text-secondary);cursor:pointer;text-transform:uppercase;letter-spacing:.5px;background:linear-gradient(135deg,#2a2a3a 0%,#1f1f2a 100%);border:1px solid #ffffff0d;border-radius:6px;padding:6px 14px;font-family:Cinzel,serif;font-size:10px;font-weight:600;transition:all .2s;box-shadow:0 2px 6px #0000004d,inset 0 1px #ffffff08}#btn-cancel-return:hover{color:var(--text-primary);background:linear-gradient(135deg,#3a3a4a 0%,#2a2a3a 100%);transform:translateY(-1px);box-shadow:0 4px 10px #0006}#btn-cancel-return:active{transform:translateY(0)}.square.joker-eliminate-own:after{content:"";pointer-events:none;z-index:10;background:radial-gradient(circle,#e74c3c99 0%,#e74c3c33 70%);border-radius:.25rem;animation:1.2s ease-in-out infinite magicPulse;position:absolute;inset:0}.square.joker-eliminate-enemy:after{content:"";pointer-events:none;z-index:10;background:radial-gradient(circle,#e67e2299 0%,#e67e2233 70%);border-radius:.25rem;animation:1.2s ease-in-out infinite magicPulse;position:absolute;inset:0}.square.joker-return:after{content:"";pointer-events:none;z-index:10;background:radial-gradient(circle,#2ecc7180 0%,#2ecc7126 70%);border-radius:.25rem;animation:1.2s ease-in-out infinite magicPulse;position:absolute;inset:0}.square.jack-own:after{content:"";pointer-events:none;z-index:10;background:radial-gradient(circle,#3498db99 0%,#3498db33 70%);border-radius:.25rem;animation:1.2s ease-in-out infinite magicPulse;position:absolute;inset:0}.square.jack-target:after{content:"";pointer-events:none;z-index:10;background:radial-gradient(circle,#e67e2299 0%,#e67e2233 70%);border-radius:.25rem;animation:1.2s ease-in-out infinite magicPulse;position:absolute;inset:0}#game-over-backdrop{z-index:99;background:radial-gradient(#0000001a 0%,#00000026 50%,#00000040 100%);animation:.5s ease-out forwards backdropFadeIn;position:fixed;inset:0}@keyframes backdropFadeIn{0%{opacity:0}to{opacity:1}}#game-over-banner{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100;text-align:center;opacity:0;background:linear-gradient(145deg,#1a1a248c 0%,#12121a99 100%);border:1.5px solid #d4af3759;border-radius:1.25rem;width:20rem;padding:2rem 1.75rem;animation:.6s cubic-bezier(.34,1.56,.64,1) .2s forwards bannerSlideIn;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)scale(.8);box-shadow:0 1rem 3rem #0000004d,0 0 4rem #d4af370f,inset 0 1px #ffffff1a,inset 0 -1px #00000026}@keyframes bannerSlideIn{0%{opacity:0;transform:translate(-50%,-40%)scale(.8)}to{opacity:1;transform:translate(-50%,-50%)scale(1)}}#game-over-banner:before{content:"";z-index:-1;opacity:0;background:linear-gradient(135deg,#d4af3726 0%,#0000 50%,#d4af371a 100%);border-radius:1.35rem;animation:2s ease-in-out .8s infinite glowPulse;position:absolute;inset:-2px}@keyframes glowPulse{0%,to{opacity:.5}50%{opacity:1}}#game-over-banner.checkmate{background:linear-gradient(145deg,#1a1a2480 0%,#12121a8c 100%);border:1.5px solid #d4af3780;box-shadow:0 1rem 3rem #0000004d,0 0 3rem #d4af371a,0 0 0 1px #d4af3714,inset 0 1px #ffffff1f}#game-over-banner.checkmate:before{background:linear-gradient(135deg,#d4af3740 0%,#0000 40%,#d4af3726 100%)}#game-over-banner.stalemate{background:linear-gradient(145deg,#1e1e2880 0%,#1616208c 100%);border:1.5px solid #9696aa66;box-shadow:0 1rem 3rem #0000004d,0 0 2rem #9696aa0f,inset 0 1px #ffffff1a}#game-over-banner.stalemate:before{background:linear-gradient(135deg,#9696aa26 0%,#0000 50%,#9696aa1a 100%)}#game-over-banner .banner-icon{opacity:0;margin-bottom:.75rem;font-size:2.5rem;animation:.5s cubic-bezier(.34,1.56,.64,1) .5s forwards iconBounceIn}@keyframes iconBounceIn{0%{opacity:0;transform:scale(0)rotate(-15deg)}to{opacity:1;transform:scale(1)rotate(0)}}#game-over-banner .banner-title{letter-spacing:.1em;text-transform:uppercase;opacity:0;margin-bottom:.5rem;font-family:Cinzel,serif;font-size:1.25rem;font-weight:700;animation:.4s ease-out .4s forwards textFadeIn}@keyframes textFadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}#game-over-banner.checkmate .banner-title{color:var(--gold-primary);text-shadow:0 0 1.5rem #d4af3799,0 2px 4px #0000004d}#game-over-banner.stalemate .banner-title{color:#b0b0c0;text-shadow:0 0 1rem #b0b0c066,0 2px 4px #0000004d}#game-over-banner .banner-subtitle{color:var(--text-primary);letter-spacing:.05em;opacity:0;margin-bottom:.75rem;font-family:Cinzel,serif;font-size:.9rem;font-weight:600;animation:.4s ease-out .55s forwards textFadeIn}#game-over-banner .banner-message{color:var(--text-secondary);opacity:0;margin-bottom:1.5rem;font-family:Inter,sans-serif;font-size:.85rem;line-height:1.6;animation:.4s ease-out .6s forwards textFadeIn}#game-over-banner .banner-divider{opacity:0;background:linear-gradient(90deg,#0000 0%,#d4af3766 50%,#0000 100%);width:60%;height:1px;margin:0 auto 1.25rem;animation:.5s ease-out .65s forwards dividerExpand}@keyframes dividerExpand{0%{opacity:0;width:0%}to{opacity:1;width:60%}}#game-over-banner .banner-restart{letter-spacing:.05em;text-transform:uppercase;cursor:pointer;opacity:0;border:none;border-radius:.625rem;width:100%;padding:.875rem 1.5rem;font-family:Cinzel,serif;font-size:.9rem;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);animation:.4s ease-out .75s forwards buttonFadeIn;position:relative;overflow:hidden}@keyframes buttonFadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}#game-over-banner .banner-restart:after{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}#game-over-banner .banner-restart:hover:after{left:100%}#game-over-banner.checkmate .banner-restart{background:linear-gradient(135deg, var(--gold-primary) 0%, var(--gold-secondary) 100%);color:var(--bg-primary);box-shadow:0 4px 20px #d4af3759,inset 0 1px #fff3}#game-over-banner.checkmate .banner-restart:hover{background:linear-gradient(135deg, var(--gold-light) 0%, var(--gold-primary) 100%);transform:translateY(-2px);box-shadow:0 8px 30px #d4af3773,inset 0 1px #ffffff40}#game-over-banner.checkmate .banner-restart:active{transform:translateY(0);box-shadow:0 2px 10px #d4af374d,inset 0 1px #fff3}#game-over-banner.stalemate .banner-restart{color:var(--text-primary);background:linear-gradient(135deg,#6a6a7a 0%,#5a5a6a 100%);box-shadow:0 4px 15px #6464784d,inset 0 1px #ffffff1a}#game-over-banner.stalemate .banner-restart:hover{background:linear-gradient(135deg,#7a7a8a 0%,#6a6a7a 100%);transform:translateY(-2px);box-shadow:0 8px 25px #64647866,inset 0 1px #ffffff26}#game-over-banner.stalemate .banner-restart:active{transform:translateY(0)}.piece{z-index:5;transition:none;position:relative}.piece.sliding{z-index:1000;pointer-events:none;transition:left .15s,top .15s;position:fixed}@keyframes sparkle{0%{opacity:0;transform:scale(.5)}50%{opacity:1;transform:scale(1.3)}to{opacity:0;transform:scale(.8)}}@keyframes magicGlow{0%{box-shadow:0 0 #9b59b600}50%{box-shadow:0 0 1.25rem #9b59b6e6}to{box-shadow:0 0 #9b59b600}}.square.magic-origin,.square.magic-destination{animation:.4s forwards magicGlow}.sparkle-container{pointer-events:none;z-index:50;width:100%;height:100%;position:absolute;top:0;left:0;overflow:visible}.sparkle-particle{background:var(--gold-primary);border-radius:50%;width:.375rem;height:.375rem;animation:.4s forwards sparkle;position:absolute}@keyframes checkPulse{0%{box-shadow:0 0 #e74c3c00}50%{box-shadow:0 0 1.25rem #e74c3ce6}to{box-shadow:0 0 #e74c3c00}}.square.in-check{animation:.8s infinite checkPulse}.captured-row{border:1px solid var(--border-subtle);background:#0003;border-radius:6px;flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:2px;min-height:24px;padding:4px 6px;display:flex}.captured-group{align-items:center;gap:1px;margin:0 2px;display:flex}.captured-piece{cursor:default;-webkit-user-select:none;user-select:none;object-fit:contain;opacity:.85;width:20px;height:20px;font-size:12px;line-height:1}.captured-piece.white-captured{color:#ecf0f1;text-shadow:0 0 3px #000000e6}.captured-piece.black-captured{color:#2c3e50;text-shadow:0 0 3px #fff6}.material-advantage{color:var(--gold-primary);text-shadow:0 0 6px #d4af3780;align-self:center;margin-left:4px;font-size:10px;font-weight:700}.player-column{flex-direction:column;flex-shrink:0;align-items:center;gap:8px;display:flex}.game-controls{background:linear-gradient(145deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%);border:1px solid var(--border-gold);border-radius:10px;justify-content:center;gap:8px;width:260px;padding:8px 12px;display:flex;box-shadow:0 4px 12px #0006,inset 0 1px #ffffff08}.btn-offer-draw{color:#8bc34a;cursor:pointer;text-transform:uppercase;letter-spacing:1px;text-align:center;background:linear-gradient(135deg,#1a3a2a 0%,#0f2a1e 100%);border:1px solid #8bc34a4d;border-radius:6px;flex:1;padding:6px 8px;font-family:Cinzel,serif;font-size:10px;font-weight:600;transition:all .2s;box-shadow:0 2px 8px #0000004d,inset 0 1px #ffffff0d}.btn-offer-draw:hover:not(:disabled){color:#a5d6a7;background:linear-gradient(135deg,#2a5a3a 0%,#1a3a2a 100%);border-color:#8bc34a99;transform:translateY(-2px);box-shadow:0 6px 16px #0006,0 0 12px #8bc34a4d}.btn-offer-draw:active:not(:disabled){transform:translateY(0)}.btn-offer-draw:disabled{opacity:.4;cursor:not-allowed}.btn-resign{color:#e74c3c;cursor:pointer;text-transform:uppercase;letter-spacing:1px;background:linear-gradient(135deg,#3a1a1a 0%,#2a0f0f 100%);border:1px solid #e74c3c4d;border-radius:6px;padding:6px 14px;font-family:Cinzel,serif;font-size:10px;font-weight:600;transition:all .2s;box-shadow:0 2px 8px #0000004d,inset 0 1px #ffffff0d}.btn-resign:hover:not(:disabled){color:#ff6b6b;background:linear-gradient(135deg,#5a2a2a 0%,#3a1a1a 100%);border-color:#e74c3c99;transform:translateY(-2px);box-shadow:0 6px 16px #0006,0 0 12px #e74c3c4d}.btn-resign:active:not(:disabled){transform:translateY(0)}.btn-resign:disabled{opacity:.4;cursor:not-allowed}#draw-panel{z-index:100;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#draw-box{background:linear-gradient(145deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%);text-align:center;border:1px solid #8bc34a80;border-radius:12px;padding:16px 20px;box-shadow:0 8px 24px #0009,0 0 20px #8bc34a26}#draw-msg{color:var(--text-primary);text-shadow:0 0 8px #8bc34a4d;letter-spacing:.5px;margin-bottom:14px;font-family:Cinzel,serif;font-size:13px}#draw-actions{justify-content:center;gap:12px;display:flex}#btn-accept-draw{color:#8bc34a;cursor:pointer;text-transform:uppercase;letter-spacing:1px;background:linear-gradient(135deg,#1a3a2a 0%,#0f2a1e 100%);border:1px solid #8bc34a4d;border-radius:8px;padding:8px 18px;font-family:Cinzel,serif;font-size:11px;font-weight:700;transition:all .2s;box-shadow:0 2px 8px #0000004d,inset 0 1px #ffffff0d}#btn-accept-draw:hover{color:#a5d6a7;background:linear-gradient(135deg,#2a5a3a 0%,#1a3a2a 100%);border-color:#8bc34a99;transform:translateY(-2px);box-shadow:0 6px 16px #0006,0 0 14px #8bc34a4d}#btn-accept-draw:active{transform:translateY(0)}#btn-decline-draw{color:#e74c3c;cursor:pointer;text-transform:uppercase;letter-spacing:1px;background:linear-gradient(135deg,#3a1a1a 0%,#2a0f0f 100%);border:1px solid #e74c3c4d;border-radius:8px;padding:8px 18px;font-family:Cinzel,serif;font-size:11px;font-weight:700;transition:all .2s;box-shadow:0 2px 8px #0000004d,inset 0 1px #ffffff0d}#btn-decline-draw:hover{color:#ff6b6b;background:linear-gradient(135deg,#5a2a2a 0%,#3a1a1a 100%);border-color:#e74c3c99;transform:translateY(-2px);box-shadow:0 6px 16px #0006,0 0 14px #e74c3c4d}#btn-decline-draw:active{transform:translateY(0)}#resign-panel{z-index:100;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#resign-box{background:linear-gradient(145deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%);text-align:center;border:1px solid #e74c3c80;border-radius:12px;padding:16px 20px;box-shadow:0 8px 24px #0009,0 0 20px #e74c3c26}#resign-msg{color:var(--text-primary);text-shadow:0 0 8px #e74c3c4d;letter-spacing:.5px;margin-bottom:14px;font-family:Cinzel,serif;font-size:13px}#resign-actions{justify-content:center;gap:12px;display:flex}#btn-confirm-resign{color:#e74c3c;cursor:pointer;text-transform:uppercase;letter-spacing:1px;background:linear-gradient(135deg,#3a1a1a 0%,#2a0f0f 100%);border:1px solid #e74c3c4d;border-radius:8px;padding:8px 18px;font-family:Cinzel,serif;font-size:11px;font-weight:700;transition:all .2s;box-shadow:0 2px 8px #0000004d,inset 0 1px #ffffff0d}#btn-confirm-resign:hover{color:#ff6b6b;background:linear-gradient(135deg,#5a2a2a 0%,#3a1a1a 100%);border-color:#e74c3c99;transform:translateY(-2px);box-shadow:0 6px 16px #0006,0 0 14px #e74c3c4d}#btn-confirm-resign:active{transform:translateY(0)}#btn-cancel-resign{color:var(--text-secondary);cursor:pointer;text-transform:uppercase;letter-spacing:1px;background:linear-gradient(135deg,#2a2a3a 0%,#1f1f2a 100%);border:1px solid #ffffff0d;border-radius:8px;padding:8px 18px;font-family:Cinzel,serif;font-size:11px;font-weight:700;transition:all .2s;box-shadow:0 2px 8px #0000004d,inset 0 1px #ffffff0d}#btn-cancel-resign:hover{color:var(--text-primary);background:linear-gradient(135deg,#3a3a4a 0%,#2a2a3a 100%);transform:translateY(-2px);box-shadow:0 6px 16px #0006}#btn-cancel-resign:active{transform:translateY(0)}#card-info-modal{background:linear-gradient(145deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%);border:.125rem solid var(--purple-primary);z-index:200;border-radius:.875rem;width:18.75rem;padding:1.25rem;animation:.2s modalPop;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 .5rem 2.5rem #0009,0 0 2rem #9b59b633}@keyframes modalPop{0%{opacity:0;transform:translate(-50%,-50%)scale(.85)}to{opacity:1;transform:translate(-50%,-50%)scale(1)}}#card-info-modal .modal-header{justify-content:space-between;align-items:center;margin-bottom:.875rem;display:flex}#card-info-modal .modal-card-preview{border:.125rem solid var(--purple-primary);background:linear-gradient(145deg, var(--bg-card) 0%, var(--bg-tertiary) 100%);width:3rem;height:4rem;color:var(--text-primary);border-radius:.5rem;flex-direction:column;justify-content:center;align-items:center;font-weight:700;display:flex;overflow:hidden}#card-info-modal .modal-card-preview img{object-fit:cover;border-radius:.375rem;width:100%;height:100%;display:block}#card-info-modal .modal-title{text-align:center;color:var(--purple-primary);text-shadow:0 0 .75rem #9b59b64d;flex:1;padding:0 .625rem;font-size:.9rem;font-weight:700}#card-info-modal .modal-close{background:var(--red-primary);color:#fff;cursor:pointer;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:1.625rem;height:1.625rem;font-size:.8rem;font-weight:700;transition:background .15s;display:flex}#card-info-modal .modal-close:hover{background:var(--red-secondary)}#card-info-modal .modal-divider{border:none;border-top:1px solid #ffffff1a;margin:.625rem 0}#card-info-modal .modal-section-title{text-transform:uppercase;letter-spacing:.0625em;margin-bottom:.375rem;font-size:.7rem;font-weight:700}#card-info-modal .modal-section-title.effect{color:var(--gold-primary);text-shadow:0 0 .5rem #d4af374d}#card-info-modal .modal-section-title.limits{color:var(--red-primary);text-shadow:0 0 .5rem #e74c3c4d}#card-info-modal .modal-section-body{margin-bottom:.625rem;font-size:.8rem;line-height:1.55}#card-info-modal .modal-section-body.effect{color:var(--text-primary)}#card-info-modal .modal-section-body.limits{color:var(--text-secondary)}#card-info-backdrop{-webkit-backdrop-filter:blur(.25rem);backdrop-filter:blur(.25rem);z-index:199;background:#0a0a0fb3;width:100%;height:100%;animation:.15s fadeIn;position:fixed;top:0;left:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.card-info-btn{color:#aaa;cursor:pointer;z-index:20;background:#1a1a2ecc;border:1px solid #fff6;border-radius:50%;justify-content:center;align-items:center;width:16px;height:16px;padding:0;font-size:.6rem;font-weight:700;line-height:1;transition:background .15s,color .15s;display:flex;position:absolute;top:4px;right:4px}.card-info-btn:hover{color:#fff;background:#9b59b6;border-color:#9b59b6}button.white-piece{text-shadow:0 0 3px #000000e6;color:#ecf0f1!important}button.black-piece{text-shadow:0 0 3px #ffffff4d;color:#2c3e50!important}.piece.dragging{opacity:0;pointer-events:none}.square.drag-over{background:#f1c40f4d}#drag-ghost{pointer-events:none;z-index:1000;filter:drop-shadow(0 4px 8px #00000080);width:70px;height:70px;position:fixed;transform:translate(-50%,-50%)}.particle{pointer-events:none;z-index:999;border-radius:50%;position:fixed}.ripple{pointer-events:none;z-index:50;border-radius:50%;animation:.4s ease-out forwards rippleAnim;position:absolute}@keyframes rippleAnim{0%{opacity:.8;transform:scale(0)}to{opacity:0;transform:scale(2.5)}}.confetti-piece{pointer-events:none;z-index:9999;border-radius:2px;width:8px;height:8px;animation:linear forwards confettiFall;position:fixed}@keyframes confettiFall{0%{opacity:1;transform:translateY(0)rotate(0)}to{opacity:0;transform:translateY(100vh)rotate(720deg)}}@keyframes cardMagicPulse{0%{box-shadow:0 0 #9b59b600}50%{box-shadow:0 0 12px #9b59b6e6}to{box-shadow:0 0 #9b59b600}}.card.needs-magic-card{border-radius:10px;animation:1.2s infinite cardMagicPulse}.banner-close{color:#aaa;cursor:pointer;background:#ffffff1a;border:none;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:.85rem;transition:background .15s,color .15s;display:flex;position:absolute;top:8px;right:8px}.banner-close:hover{color:#fff;background:#fff3}#btn-play-again-game-controls-white,#btn-play-again-game-controls-black{color:#8bc34a;cursor:pointer;text-transform:uppercase;letter-spacing:1px;background:linear-gradient(135deg,#1a3a2a 0%,#0f2a1e 100%);border:1px solid #8bc34a4d;border-radius:8px;width:100%;padding:8px 18px;font-family:Cinzel,serif;font-size:11px;font-weight:700;transition:all .2s;box-shadow:0 2px 8px #0000004d,inset 0 1px #ffffff0d}#btn-play-again-game-controls-white:hover,#btn-play-again-game-controls-black:hover{color:#a5d6a7;background:linear-gradient(135deg,#2a5a3a 0%,#1a3a2a 100%);border-color:#8bc34a99;transform:translateY(-2px);box-shadow:0 6px 16px #0006,0 0 14px #8bc34a4d}#btn-play-again:active{transform:translateY(0)}#back-to-menu{top:max(12px, env(safe-area-inset-top,0px));left:max(12px, env(safe-area-inset-left,0px));border:1px solid var(--border-gold);color:var(--gold-primary);letter-spacing:.08em;text-transform:uppercase;z-index:50;background:#0a0a0fd9;border-radius:6px;padding:5px 12px;font-family:Cinzel,serif;font-size:.7rem;font-weight:600;text-decoration:none;transition:all .2s;position:fixed}#back-to-menu:hover{border-color:var(--gold-primary);background:#d4af3714}#mobile-bottom-row{flex-direction:column;gap:8px;width:260px;margin-top:8px;display:flex}@media (width<=768px){#app{width:100%;height:100dvh;padding:.2rem 10px;padding-top:calc(env(safe-area-inset-top,0px) + 50px);padding-bottom:max(90px, env(safe-area-inset-bottom,0px));justify-content:flex-start;gap:.15rem;overflow-y:auto}#turn-indicator{min-height:18px;padding:3px 0;font-size:12px}#phase-indicator{min-height:14px;padding:1px 0;font-size:9px}#game-container{flex-direction:column;gap:.3rem;width:100%}#center-area{order:-1}.player-column{width:100%;max-width:100%;transform:none}body:not(.i-am-black) #game-container>.player-column:first-child .panel-cards,body:not(.i-am-black) #game-container>.player-column:first-child .game-controls,body.i-am-black #game-container>.player-column:last-child .panel-cards,body.i-am-black #game-container>.player-column:last-child .game-controls{display:none}.player-panel{width:94%;min-width:0;max-width:94%;max-height:none}.game-controls{width:100%}#board{grid-template-rows:repeat(8,min(9vw,33px));grid-template-columns:repeat(8,min(9vw,33px))}.square{width:min(9vw,33px);height:min(9vw,33px)}.hand{grid-template-columns:repeat(5,1fr);justify-content:stretch;gap:3px;padding:3px}.card{aspect-ratio:2/3;width:100%;height:auto}.panel-header{padding:3px 8px}.panel-title{font-size:10px}.panel-captured{padding:3px 6px}.captured-label,.cards-label{margin-bottom:2px;font-size:8px}.panel-cards{scroll-snap-type:y mandatory;scroll-snap-stop:always;max-height:70px;padding:3px;overflow-y:auto}.card{scroll-snap-align:start}.captured-piece{width:15px;height:15px}.game-controls{gap:4px;padding:3px 8px}.btn-offer-draw,.btn-resign{padding:3px 6px;font-size:8px}#card-info{gap:10px;padding:5px 10px}#discard-top,#deck-count{width:32px;height:44px}#discard-label,#deck-count-label{font-size:8px}#game-container{flex-direction:column;width:100%}#mobile-bottom-row{flex-direction:row;gap:10px;width:78%;min-width:0;max-width:78%;margin:4px auto}#mobile-bottom-row .game-controls,#mobile-bottom-row #card-info{flex:1;gap:5px;width:auto;min-width:0;padding:5px}#mobile-bottom-row .btn-offer-draw,#mobile-bottom-row .btn-resign{padding:3px 4px;font-size:8px}#mobile-bottom-row #discard-top,#mobile-bottom-row #deck-count{width:32px;height:42px}#mobile-bottom-row #discard-label,#mobile-bottom-row #deck-count-label{font-size:9px}.player-panel.expanded{z-index:500;width:92vw;max-width:92vw;max-height:80vh;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 20px 60px #000000b3,0 0 40px #d4af3726}.player-panel.expanded .panel-cards{aspect-ratio:auto;scroll-snap-type:none;max-height:60vh;overflow-y:auto}.player-panel.expanded .hand{grid-template-columns:repeat(3,1fr)}.player-panel.expanded .card{scroll-snap-align:none}#panel-white-backdrop{z-index:400;pointer-events:none;background:#0009;display:none;position:fixed;inset:0}.player-panel.expanded~#panel-white-backdrop{display:block}body:has(.player-panel.expanded) #panel-white-backdrop{display:block}}.player-tag{text-align:center;width:100%;color:var(--gold-primary);letter-spacing:1px;text-transform:uppercase;white-space:nowrap;text-overflow:ellipsis;font-family:Cinzel,serif;font-size:13px;font-weight:600;overflow:hidden}.player-tag:empty{display:none}@media (width<=768px){.player-tag{letter-spacing:.5px;font-size:10px;line-height:1.2}}.player-clock{letter-spacing:.08em;text-align:center;color:var(--text-primary);font-family:Cinzel,serif;font-size:1.1rem;font-weight:700;line-height:1}@media (width<=768px){#app{padding-top:calc(env(safe-area-inset-top,0px) + 42px);padding-bottom:calc(env(safe-area-inset-bottom,0px) + 10px)}.player-column{grid-template-columns:1fr auto;align-items:center;gap:2px 8px;width:94%;margin:0 auto;display:grid}.player-column .player-tag{text-align:left;width:auto;padding-left:2px}.player-column .player-panel{grid-column:1/-1;width:100%;max-width:100%}.player-clock{text-align:right;padding-right:2px;font-size:.95rem}}@media (width<=768px) and (height<=720px){#board{grid-template-rows:repeat(8,min(8.4vw,29px));grid-template-columns:repeat(8,min(8.4vw,29px))}.square{width:min(8.4vw,29px);height:min(8.4vw,29px)}.panel-cards{max-height:56px}}