:root{--figure-shadow-blur: .5px;--figure-shadow-spread: .25px;--figure-shadow-offset: .5px;--figure-shadow-large-blur: 2px;--figure-shadow-large-spread: .75px;--figure-hover-shadow-blur: .75px;--figure-hover-shadow-spread: 1.5px;--figure-hover-shadow-offset: .25px;--figure-transform-hover: -.25px;--figure-transform-selected: -.5px;--bg-primary: #f4f4f4;--bg-secondary: #ffffff;--text-primary: #333333;--text-secondary: #666666;--border-color: #e0e0e0;--card-bg: rgba(255, 255, 255, .95);--card-border: #1976d2;--shadow-color: rgba(0, 0, 0, .1);--figure-border: rgba(255, 255, 255, .6);--figure-shadow: rgba(0, 0, 0, .3);--figure-glow: rgba(255, 255, 255, .3);--coin-shadow: rgba(255, 215, 0, .5);--coin-glow: rgba(255, 255, 255, .4);--board-background: #f0f0f0;--game-paper-bg: rgba(255, 255, 255, .95);--right-panel-bg: #fafafa;--zoom-indicator-bg: rgba(0, 0, 0, .7)}[data-theme=dark]{--bg-primary: #121212;--bg-secondary: #1e1e1e;--text-primary: #ffffff;--text-secondary: #b0b0b0;--border-color: #333333;--card-bg: rgba(30, 30, 30, .95);--card-border: #64b5f6;--shadow-color: rgba(0, 0, 0, .3);--figure-border: rgba(255, 255, 255, .4);--figure-shadow: rgba(0, 0, 0, .6);--figure-glow: rgba(255, 255, 255, .2);--coin-shadow: rgba(255, 215, 0, .7);--coin-glow: rgba(255, 255, 255, .3);--board-background: #000000;--game-paper-bg: rgba(0, 0, 0, .95);--right-panel-bg: #000000;--zoom-indicator-bg: rgba(255, 255, 255, .2)}body{margin:0;padding:0;background-color:var(--bg-primary);color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;min-height:100vh;transition:background-color .3s ease,color .3s ease}[data-theme=dark] body,body.dark,[data-theme=dark] html,html.dark{background-color:#121212!important}#root{min-height:100vh;display:flex;flex-direction:column;background-color:var(--bg-primary);transition:background-color .3s ease}[data-theme=dark] #root{background-color:#121212!important}.board{display:grid;grid-template-columns:repeat(13,1fr);grid-template-rows:repeat(13,1fr);gap:0;width:650px;height:650px;box-sizing:border-box;margin:0;position:relative;max-width:none;max-height:none;overflow:visible;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}@media (max-width: 768px){.board{width:520px;height:520px}}@media (max-width: 600px){.board{width:455px;height:455px}}@media (max-width: 480px){.board{width:390px;height:390px}}@media (max-width: 768px){.figures-area{height:65%}.coins-area{height:30%}}@media (max-width: 480px){.figures-area{height:70%}.coins-area{height:25%}}.card img{border:none;padding:0;margin:0}.card{border:solid 2px var(--bg-secondary);display:flex;justify-content:center;align-items:center;aspect-ratio:1;font-size:clamp(.8rem,2vw,1rem);color:var(--text-primary);box-sizing:border-box;position:relative;cursor:pointer;transition:border-color .2s ease,background-color .3s ease;overflow:visible;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none}@media (max-width: 768px){.card{border-width:1px;min-height:20px}}.card.with-shadow{filter:drop-shadow(0 0 2px rgba(0,0,0,.3))}[data-theme=dark] .card img{filter:brightness(.7) contrast(1.1)}[data-theme=dark] .card:not(.with-shadow) img{filter:brightness(.5) contrast(1.2) saturate(.8)}.card.selectable:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-color:#ff0;opacity:.6}.card.selectable:hover{border:solid 2px red}@media (hover: hover){.card.selectable:hover{border:solid 2px red}}@media (max-width: 768px){.card.selectable:active{border:solid 2px red;background-color:#ff00001a}}.figures-container{position:absolute;top:-4px;left:-4px;right:-4px;bottom:-4px;display:flex;flex-direction:row;justify-content:space-evenly;align-items:center;width:calc(100% + 8px);height:calc(100% + 8px);z-index:10;overflow:visible;padding:2px;box-sizing:border-box;pointer-events:none}.single-stage-layout{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;position:relative}.figures-top{position:absolute;top:2px;left:50%;transform:translate(-50%);display:flex;flex-direction:row;justify-content:center;align-items:center;gap:-5px;max-width:100%;z-index:15}.figures-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:row;justify-content:center;align-items:center;gap:-5px;max-width:100%;z-index:15}.coins-bottom{position:absolute;bottom:2px;left:50%;transform:translate(-50%);display:flex;flex-direction:row;justify-content:center;align-items:center;gap:-5px;max-width:100%;z-index:10}.figures-top>*,.figures-center>*{margin-left:-8px}.figures-top>*:first-child,.figures-center>*:first-child{margin-left:0}.coins-bottom>*{margin-left:-8px}.coins-bottom>*:first-child{margin-left:0}.stage{display:flex;flex-direction:column;justify-content:space-between;align-items:center;flex:1;height:100%;width:100%;overflow:visible;pointer-events:none;gap:2px}.stage-with-position{position:relative;display:block;overflow:visible}.figures-area{display:flex;flex-direction:row;justify-content:space-evenly;align-items:center;flex:1;height:60%;width:100%;overflow:visible;pointer-events:none}.coins-area{display:flex;flex-direction:row;justify-content:space-evenly;align-items:center;height:35%;width:100%;overflow:hidden;pointer-events:none;padding:2px}.figure{display:flex;justify-content:center;align-items:center;flex:1;height:100%;width:100%;position:relative;overflow:visible;max-width:100%;max-height:100%;transition:all .2s ease;cursor:pointer;pointer-events:auto;min-width:20px;min-height:20px;aspect-ratio:1;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none}.figure img{width:16px;height:16px;object-fit:contain;filter:drop-shadow(0 0 var(--figure-shadow-blur) black) drop-shadow(0 0 var(--figure-shadow-spread) white);flex-shrink:0;border:none;border-radius:50%;box-shadow:0 var(--figure-shadow-offset) var(--figure-shadow-large-blur) #0000004d,0 var(--figure-shadow-spread) var(--figure-shadow-large-spread) #0003;background:linear-gradient(135deg,#ffffff1a,#ffffff0d);transition:all .2s ease;box-sizing:border-box;aspect-ratio:1;position:relative}.figure.selectable img{border:2px solid var(--figure-border);box-shadow:0 var(--figure-shadow-offset) var(--figure-shadow-large-blur) var(--figure-shadow),0 var(--figure-shadow-spread) var(--figure-shadow-large-spread) var(--figure-shadow),0 0 0 2px var(--figure-border),inset 0 0 0 1px var(--figure-border);filter:drop-shadow(0 0 var(--figure-shadow-blur) black) drop-shadow(0 0 var(--figure-shadow-spread) white) drop-shadow(0 0 3px var(--figure-glow));animation:selectablePulse 2s ease-in-out infinite}@keyframes selectablePulse{0%,to{box-shadow:0 var(--figure-shadow-offset) var(--figure-shadow-large-blur) var(--figure-shadow),0 var(--figure-shadow-spread) var(--figure-shadow-large-spread) var(--figure-shadow),0 0 0 2px var(--figure-border),inset 0 0 0 1px var(--figure-border)}50%{box-shadow:0 var(--figure-shadow-offset) var(--figure-shadow-large-blur) var(--figure-shadow),0 var(--figure-shadow-spread) var(--figure-shadow-large-spread) var(--figure-shadow),0 0 0 3px var(--figure-border),inset 0 0 0 1px var(--figure-border)}}.figure-positioned{position:absolute;z-index:10;min-width:20px;min-height:20px;display:flex;justify-content:center;align-items:center}.figure-positioned img{width:16px!important;height:16px!important;object-fit:contain;flex-shrink:0}.coin-positioned{position:absolute;z-index:5;min-width:16px;min-height:16px;display:flex;justify-content:center;align-items:center}.coin-positioned .coin-image{width:14px!important;height:14px!important;object-fit:contain;flex-shrink:0}.figure.selectable:hover img{border:3px solid #ff4444;box-shadow:0 0 0 2px #f449;transform:translateY(var(--figure-transform-hover)) scale(1.1);transition:all .2s ease;filter:brightness(1.2);animation:none}.figure.selected img{border:3px solid #44ff44;box-shadow:0 0 0 2px #4f49;transform:translateY(var(--figure-transform-selected)) scale(1.1);transition:all .2s ease;filter:brightness(1.2);animation:selectedPulse 1.5s ease-in-out infinite}@media (hover: hover){.figure.selectable:hover img{border:3px solid #ff4444;box-shadow:0 0 0 2px #f449;transform:translateY(var(--figure-transform-hover)) scale(1.1);transition:all .2s ease;filter:brightness(1.2);animation:none}}@media (max-width: 768px){.figure.selectable:active img{border:3px solid #ff4444;box-shadow:0 0 0 2px #f449;transform:translateY(var(--figure-transform-hover)) scale(1.1);transition:all .2s ease;filter:brightness(1.2);animation:none}.figure.selected:active img{border:3px solid #44ff44;box-shadow:0 0 0 2px #4f49;transform:translateY(var(--figure-transform-selected)) scale(1.1);transition:all .2s ease;filter:brightness(1.2)}}@media (max-width: 768px){body{overflow-x:hidden}button,.card{min-height:44px;min-width:44px}.figure{min-height:20px;min-width:20px}.MuiContainer-root{padding-left:8px!important;padding-right:8px!important}.board{touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.board,.card,.figure{-webkit-overflow-scrolling:touch;transform:translateZ(0)}}@media (max-width: 360px) and (max-height: 800px){body{font-size:14px}.card{min-height:26px;min-width:26px;touch-action:manipulation}.figure{min-height:20px;min-width:20px}.figure img,.coin-image,.figure-positioned img{width:10px!important;height:10px!important}.coin-positioned .coin-image{width:8px!important;height:8px!important}.figure-carried-coin-behind .coin-image{width:10px!important;height:10px!important}.figure-carried-coin .coin-image{width:8px!important;height:8px!important}button{min-height:48px;padding:12px 16px;font-size:16px}.MuiContainer-root{padding-left:4px!important;padding-right:4px!important}input,select,textarea{font-size:16px}}@media (max-width: 768px) and (orientation: landscape){.game-info{margin-bottom:.5rem;padding:.5rem}}@media (max-width: 800px) and (orientation: landscape) and (max-height: 400px){.game-info{margin:.25rem;padding:.25rem;display:flex;flex-direction:row;flex-wrap:wrap;gap:.5rem;font-size:.75rem}.game-id,.players,.active-player,.action,.state{font-size:.7rem;flex:1;min-width:120px}}@media (max-width: 360px){.game-container{padding:.25rem}.game-info{padding:.75rem}.game-id,.players,.active-player,.action,.state{font-size:.8rem;line-height:1.3}.card{border-width:1px;font-size:.7rem}.figure img,.coin-image,.figure-positioned img{width:10px!important;height:10px!important}.coin-positioned .coin-image{width:8px!important;height:8px!important}.figure-carried-coin-behind .coin-image{width:10px!important;height:10px!important}.figure-carried-coin .coin-image{width:8px!important;height:8px!important}.figures-container{top:-6px;left:-6px;right:-6px;bottom:-6px;width:calc(100% + 12px);height:calc(100% + 12px);padding:1px}}@media (max-width: 320px){.game-container{padding:.125rem}.game-info{padding:.5rem}.game-id,.players,.active-player,.action,.state{font-size:.75rem}}.card-preview{background-color:var(--card-bg);border:2px solid var(--card-border);border-radius:8px;padding:1rem;margin:1rem 0;box-shadow:0 4px 8px var(--shadow-color);animation:fadeIn .3s ease-in-out;transition:background-color .3s ease,border-color .3s ease,box-shadow .3s ease}.card-preview-title{font-weight:700;color:var(--card-border);font-size:1.1rem;margin-bottom:.5rem;text-align:center;transition:color .3s ease}.card-preview-image{display:flex;justify-content:center;align-items:center;margin-bottom:.75rem}.preview-card-image{width:140px;height:140px;object-fit:contain;border-radius:4px;box-shadow:0 2px 8px #0003;transition:transform .2s ease}.preview-card-image:hover{transform:scale(1.05)}.card-preview-info{text-align:center;font-size:.9rem;color:var(--text-primary);transition:color .3s ease}.card-name{font-weight:700;color:var(--card-border);margin-bottom:.25rem;transition:color .3s ease}.card-position{color:var(--text-secondary);margin-bottom:.25rem;transition:color .3s ease}.card-status{color:#2e7d32;font-style:italic}.card-figures{margin-top:1rem;padding-top:.75rem;border-top:1px solid var(--border-color);transition:border-color .3s ease}.figures-title{font-weight:700;color:var(--card-border);font-size:.95rem;margin-bottom:.5rem;transition:color .3s ease}.stage-info{margin-bottom:.75rem;padding:.5rem;background-color:var(--card-border);background-color:#1976d20d;border-radius:4px;border-left:3px solid var(--card-border);transition:background-color .3s ease,border-color .3s ease}[data-theme=dark] .stage-info{background-color:#64b5f61a}.stage-label{font-weight:700;color:var(--text-primary);font-size:.85rem;margin-bottom:.25rem;transition:color .3s ease}.figures-list{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.25rem}.figure-info{display:flex;align-items:center;gap:.25rem;padding:.25rem .5rem;background-color:var(--bg-secondary);border-radius:12px;border:1px solid var(--border-color);font-size:.8rem;transition:background-color .3s ease,border-color .3s ease}.figure-preview-icon{width:16px;height:16px;object-fit:contain;border-radius:50%;box-shadow:0 1px 3px #0003}.figure-color{font-weight:700;text-transform:capitalize}.figure-selected{color:#2e7d32;font-weight:700;font-size:.75rem}.no-figures{color:var(--text-secondary);font-style:italic;font-size:.8rem;transition:color .3s ease}.coins-info{color:#f57f17;font-weight:700;font-size:.8rem;margin-top:.25rem}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes selectedPulse{0%,to{box-shadow:0 0 0 2px #4f49}50%{box-shadow:0 0 0 3px #4f4c}}@media (max-width: 768px){.card-preview{padding:.75rem;margin:.75rem 0}.preview-card-image{width:140px;height:140px}.card-preview-title{font-size:1rem}.card-preview-info{font-size:.85rem}.figures-list{gap:.25rem}.figure-info{padding:.2rem .4rem;font-size:.75rem}.figure-preview-icon{width:14px;height:14px}}.manual,.manual p,.manual ul,.manual li,.manual strong,.manual ol{color:var(--text-primary);transition:color .3s ease}.manual .MuiTypography-root{color:var(--text-primary)!important;transition:color .3s ease}.manual *{color:inherit}@media (max-width: 360px){*{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}.card,.figure,button{-webkit-tap-highlight-color:rgba(0,0,0,.1);-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.board{-webkit-overflow-scrolling:touch;transform:translateZ(0)}.card img,.figure img{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}.card-preview{padding:.4rem;margin:.4rem 0}.preview-card-image{width:100px;height:100px}.card-preview-title{font-size:.85rem}.card-preview-info{font-size:.75rem}.figures-list{gap:.15rem}.figure-info{padding:.1rem .25rem;font-size:.65rem}.figure-preview-icon{width:10px;height:10px}.stage-info{padding:.3rem;margin-bottom:.4rem}}.coin{display:flex;justify-content:center;align-items:center;position:relative;width:100%;height:100%;pointer-events:none}.coin-image{width:16px;height:16px;object-fit:contain;border-radius:50%;box-shadow:0 1px 3px var(--figure-shadow),0 0 8px var(--coin-glow);filter:drop-shadow(0 0 2px var(--coin-shadow)) drop-shadow(0 0 4px var(--coin-glow));transition:all .2s ease}.figure-carried-coin-behind{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1;pointer-events:none}.figure-carried-coin-behind .coin-image{width:16px;height:16px;border:1px solid var(--figure-border);box-shadow:0 1px 3px var(--figure-shadow),0 0 6px var(--coin-glow);filter:drop-shadow(0 0 2px var(--coin-glow));opacity:.6}.figure-carried-coin{position:absolute;top:-2px;right:-2px;z-index:20;pointer-events:none}.figure-carried-coin .coin-image{width:12px;height:12px;border:1px solid var(--figure-border);box-shadow:0 1px 3px var(--figure-shadow),0 0 6px var(--coin-glow);filter:drop-shadow(0 0 2px var(--coin-glow))}.coins-list{display:flex;flex-wrap:wrap;gap:.25rem;margin-top:.25rem}.coin-info{display:flex;align-items:center;justify-content:center;padding:.2rem;background-color:#ffd7001a;border-radius:50%;border:1px solid rgba(255,215,0,.3)}.coin-preview-icon{width:14px;height:14px;object-fit:contain;border-radius:50%;box-shadow:0 1px 2px #0003}.coins-title{font-weight:700;color:#f57f17;font-size:.8rem;margin-bottom:.25rem}.figure-carried-coin-preview{display:flex;align-items:center;justify-content:center;margin-left:.25rem}.carried-coin-preview-icon{width:12px;height:12px;object-fit:contain;border-radius:50%;box-shadow:0 1px 2px #0003;border:1px solid rgba(255,215,0,.5)}.card{touch-action:manipulation}
