#root{width:100vw;min-height:100vh;margin:0;display:flex;justify-content:center;align-items:center;text-align:center;box-sizing:border-box;padding:0;background-color:#2e332c;-webkit-user-select:none;user-select:none}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}.card{padding:2em}.read-the-docs{color:#888}.piece{transition:top .3s ease,left .3s ease}.app-container{display:flex;gap:20px;padding:0;align-items:flex-start;max-width:100vw;margin:auto;box-sizing:border-box;height:auto;flex-direction:row}.board-wrapper{position:relative;flex:0 0 1fr;display:flex;justify-content:center;align-items:flex-start;box-sizing:border-box;min-width:300px}.right-column{width:1fr;position:relative;display:flex;flex-direction:column;gap:10px;flex:0 0 1fr;box-sizing:border-box;min-width:300px;align-items:flex-start}.board-grid{width:1fr;max-width:none;aspect-ratio:1 / 1;display:grid;grid-template-columns:repeat(10,1fr);grid-template-rows:repeat(10,1fr);gap:4px;background-color:#d79e6e;box-sizing:border-box;position:relative}.board-grid{width:min(607px,86vw);aspect-ratio:1 / 1;display:grid;grid-template-columns:repeat(10,1fr);grid-template-rows:repeat(10,1fr);gap:0px;background-color:#d79e6e;box-sizing:border-box;position:relative}.board-container.flipped,.board-container.flipped .board-square{transform:rotate(180deg)}.board-square{width:100%;height:100%;box-sizing:border-box;position:relative;display:flex;align-items:center;justify-content:center}.board-labels-left{position:absolute;left:.3rem;top:0;height:100%;display:flex;flex-direction:column;justify-content:space-around;font-family:poppins,sans-serif;font-weight:600;font-size:clamp(10px,1.2vw,14px);z-index:30}.board-labels-left div:nth-child(odd){color:#f1f3e0}.board-labels-left div:nth-child(2n){color:#a1bc98}.board-labels-bottom{position:absolute;bottom:.3rem;left:0;width:100%;display:flex;justify-content:space-around;font-family:poppins,sans-serif;font-weight:600;font-size:clamp(10px,1.2vw,14px);z-index:30}.board-labels-bottom div:nth-child(odd){color:#a1bc98}.board-labels-bottom div:nth-child(2n){color:#f1f3e0}.board-container.flipped .board-labels-left div:nth-child(odd){color:#a1bc98}.board-container.flipped .board-labels-left div:nth-child(2n){color:#f1f3e0}.board-container.flipped .board-labels-bottom div:nth-child(odd){color:#f1f3e0}.board-container.flipped .board-labels-bottom div:nth-child(2n){color:#a1bc98}.piece-circle{width:clamp(36px,6.5vw,48px);height:clamp(36px,6.5vw,48px);border-radius:50%;display:flex;align-items:center;justify-content:center;box-sizing:border-box;cursor:grab;transition:transform .12s ease,box-shadow .12s ease}.owner-p1 .piece-circle{background:radial-gradient(circle,#f1f1f1,#e6e6e6);border:7px solid #cbcbcb;color:#23232300}.owner-p2 .piece-circle{background:radial-gradient(circle,#585858,#3d3d3d);border:7px solid #383838;color:#f1f1f100}.piece-stack-item{position:absolute;left:50%;transform:translate(-50%)}.highlight-dot{width:clamp(10px,1.6vw,15px);height:clamp(10px,1.6vw,15px);border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:999}.hide-scrollbar::-webkit-scrollbar{display:none}.hide-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.panel{padding:0;background-color:#a1bc98;border-radius:0;width:100%;box-sizing:border-box}.tower-grid{display:grid;grid-template-columns:repeat(3,1fr);justify-content:space-around;text-align:center;padding:16px}.tier-label{font-weight:600;font-family:poppins;color:#252525;font-size:20px}.tier-placeholder{width:clamp(53px,6vw,53px);height:clamp(53px,6vw,53px);border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;color:#666;font-size:clamp(14px,1.6vw,18px)}.stock-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:12px;width:100%;box-sizing:border-box;padding:16px}.stock-item{width:42px;height:42px;aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center;border-radius:50%;box-sizing:border-box;position:relative}.count-badge{position:absolute;top:-40%;right:-40%;width:clamp(16px,3vw,20px);height:clamp(16px,3vw,20px);border-radius:50%;background:#2fff00;display:flex;align-items:center;justify-content:center;font-family:poppins;font-size:clamp(9px,1.6vw,12px);font-weight:600;color:#232323}@media(max-width:1024px){.app-container{flex-direction:row;align-items:stretch;gap:20px;padding:12px;width:100%}.right-column{width:40vw;flex-basis:auto;max-width:none;min-width:0}.board-grid{width:min(60vw)}.stock-grid{grid-template-columns:repeat(5,1fr)}}@media(max-width:768px){.app-container{flex-direction:column;align-items:stretch;gap:20px;padding:12px;width:100%}.right-column{width:100%;flex-basis:auto;max-width:none;min-width:0}.board-wrapper{width:100%;justify-content:start}.board-labels-left{left:-2rem;font-size:14px}.board-labels-bottom{bottom:-2rem;font-size:14px}.stock-grid{grid-template-columns:repeat(7,1fr)}.board-grid{width:min(96vw);height:auto}.owner-p1 .piece-circle,.owner-p2 .piece-circle{border-width:6px}}@media(max-width:420px){.stock-grid{grid-template-columns:repeat(6,1fr);gap:8px}.piece-circle{width:clamp(32px,18vw,44px);height:clamp(32px,18vw,44px)}.count-badge{top:-15%;right:-15%;width:20px;height:20px;font-size:12px}.board-wrapper{width:100%;justify-content:center}.board-grid{width:94vw;height:auto}.piece-circle{width:30px;height:30px}.board-labels-left{left:-2rem;font-size:9px}.board-labels-bottom{bottom:-2rem;font-size:9px}.owner-p1 .piece-circle,.owner-p2 .piece-circle{border-width:4px}}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif,poppins;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#000;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;min-width:320px;min-height:100vh;display:block}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:poppins;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{background-color:#3f3f3f}button:active{background-color:#3f3f3f;transform:scale(.9)}button:focus,button:focus-visible{outline:none}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}