#arx-container{align-items:center;display:flex;justify-content:center;position:relative;width:100%}#arx-board{--board-size:740px;--margin:calc(var(--board-size)/12);height:calc(var(--board-size)*1.034);position:relative;width:var(--board-size)}#arx-board-shadow{border-radius:4%;box-shadow:0 2px 4px 1px #000}#arx-board-background,#arx-board-shadow{height:100%;position:absolute;top:0;width:100%}#arx-board-background{background-image:url(img/board.webp);background-size:cover}#arx-board-spaces{display:grid;grid-template-columns:repeat(9,1fr);grid-template-rows:repeat(9,1fr);height:calc(96.7118% - var(--margin)*2);margin:var(--margin) var(--margin) calc(var(--margin)*1.034) var(--margin);position:absolute;width:calc(100% - var(--margin)*2)}.arx-space{--column:0;--row:0;grid-area:var(--row) /var(--column)}.arx-center,.arx-space{position:relative}#arx-center-4-4{background-color:red}.arx-space.arx-selectable{--highlight:rgba(90,59,164,.8);background-image:repeating-linear-gradient(45deg,var(--highlight),var(--highlight) 5px,transparent 8px,transparent 11px),repeating-linear-gradient(-45deg,var(--highlight),var(--highlight) 5px,transparent 8px,transparent 11px)}.arx-space.arx-selectable:hover{background-color:var(--highlight)}.arx-piece{border:3px solid transparent;box-sizing:border-box;height:100%;position:relative;width:100%}.arx-piece-shadow,.arx-piece-sprite{position:absolute}.arx-piece-shadow{--color:rgba(43,2,2,.8);background-color:var(--color);border-radius:100%;box-shadow:0 1px 3px 2px var(--color);height:100%;transition:scale .18s cubic-bezier(.33,.66,.66,1),opacity .18s cubic-bezier(.33,.66,.66,1);width:100%}.arx-piece-icon,.arx-piece-sprite{background-image:url(img/piece.webp);background-position-x:calc(var(--sprite-x)*-100%);background-size:300% 100%}.arx-piece-sprite{bottom:0;height:123%;width:100%}.arx-piece-icon[data-side="0"],.arx-piece[data-side="0"] .arx-piece-sprite{--sprite-x:0}.arx-piece-icon[data-side="1"],.arx-piece[data-side="1"] .arx-piece-sprite{--sprite-x:1}.arx-piece-icon[data-side="2"],.arx-piece[data-side="2"] .arx-piece-sprite{--sprite-x:2}.arx-piece.arx-selectable:hover .arx-piece-sprite{filter:contrast(1.1) brightness(1.1)}.arx-piece[data-side="1"].arx-selectable:hover .arx-piece-sprite{filter:contrast(1.2) brightness(1.6)}.arx-piece:not(.arx-moving,.arx-moving-offset,.arx-drop):after{--color:#eeac18;background-image:radial-gradient(transparent,transparent 34%,var(--color) 34%,var(--color) 44%,transparent 44%);border-radius:100%;bottom:22%;content:"";display:block;height:100%;opacity:0;position:absolute;transition:visibility .15s ease-out,opacity .15s ease-out;visibility:hidden;width:100%}.arx-piece.arx-last-move:after,.arx-piece.arx-selectable:hover:after{opacity:100%;transition:visibility 50ms ease-out,opacity 50ms ease-out;visibility:visible}.arx-piece.arx-hold-last-move:after,.arx-piece.arx-last-move:after{--color:#5707d5}.arx-piece.arx-last-move:after{transition:visibility .25s ease-out,opacity .25s ease-out}.arx-piece.arx-selected{border:3px solid gold}.arx-letters{--width:60px;align-items:center;display:grid;justify-content:center;position:absolute}#arx-letters-bottom,#arx-letters-top{grid-template-columns:repeat(9,1fr);height:var(--width);width:100%}#arx-letters-top{bottom:100%}#arx-letters-bottom{top:100%}#arx-letters-left,#arx-letters-right{grid-template-rows:repeat(9,1fr);height:100%;width:var(--width)}#arx-letters-right{left:100%}#arx-letters-left{right:100%}.arx-letter{color:#4a1b00;font-size:40px;font-weight:700;text-align:center}.arx-piece-icon{--icon-size:36px;display:inline-block;height:calc(var(--icon-size)*1.23);vertical-align:middle;width:var(--icon-size)}.arx-moving,.arx-moving-offset{--scale:1;--duration:500ms;--delay:0ms;--z-index:9;z-index:var(--z-index)}.arx-moving{--dx:0;--dy:0;animation:arx-move var(--duration) ease-in both;transform:translate(var(--dx),var(--dy)) scale(var(--scale));transform-origin:center}.arx-moving-offset{--path:"";animation:arx-move-offset var(--duration) ease-in both;offset:path(var(--path)) 0 0deg;transform-origin:top left}@keyframes arx-move{to{transform:none}}@keyframes arx-move-offset{0%{offset-distance:100%;transform:scale(var(--scale))}to{offset-distance:0;transform:none}}.arx-moving .arx-piece-sprite,.arx-moving-offset .arx-piece-sprite{animation:arx-float var(--duration) cubic-bezier(.33,.66,.66,1)}@keyframes arx-float{0%{translate:0 0}to{translate:0 -65%}}.arx-drop .arx-piece-sprite{animation:arx-drop .18s cubic-bezier(.33,0,.33,1)}@keyframes arx-drop{0%{translate:0 -65%}to{translate:0 0}}.arx-moving .arx-piece-shadow,.arx-moving-offset .arx-piece-shadow{opacity:.3;scale:.65;transition:scale var(--duration) cubic-bezier(.33,0,.33,1),opacity var(--duration) cubic-bezier(.33,0,.33,1)}