.dot-grid{width:100%;height:100%;position:relative;overflow:hidden}.dot-grid__wrap{width:100%;height:100%;position:absolute;top:0;left:0}.dot-grid__canvas{width:100%;height:100%;display:block}
.dome-root{--dome-radius:520px;--dome-viewer-pad:72px;--dome-circ:calc(var(--dome-radius)*3.14);--dome-rot-y:calc((360deg/var(--dome-segments-x))/2);--dome-rot-x:calc((360deg/var(--dome-segments-y))/2);--dome-item-width:calc(var(--dome-circ)/var(--dome-segments-x));--dome-item-height:calc(var(--dome-circ)/var(--dome-segments-y));width:100vw;height:850px;position:relative;left:50%;overflow:hidden;transform:translate(-50%)}.dome-root *{box-sizing:border-box}.dome-sphere,.dome-item,.dome-item__card{transform-style:preserve-3d}main.dome-main{touch-action:none;-webkit-user-select:none;user-select:none;background:0 0;place-items:center;display:grid;position:absolute;inset:0;overflow:hidden}.dome-stage{width:100%;height:100%;perspective:calc(var(--dome-radius)*2);perspective-origin:50%;contain:layout paint size;place-items:center;display:grid}.dome-sphere{transform:translateZ(calc(var(--dome-radius)*-1));will-change:transform}.dome-overlay,.dome-overlay--blur{z-index:3;pointer-events:none;margin:auto;position:absolute;inset:0}.dome-overlay{background-image:radial-gradient(transparent 55%,var(--dome-overlay-color,#fff)100%)}.dome-overlay--blur{-webkit-mask-image:radial-gradient(transparent 60%,var(--dome-overlay-color,#fff)90%);-webkit-mask-image:radial-gradient(transparent 60%,var(--dome-overlay-color,#fff)90%);mask-image:radial-gradient(transparent 60%,var(--dome-overlay-color,#fff)90%);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.dome-item{width:calc(var(--dome-item-width)*var(--dome-item-size-x));height:calc(var(--dome-item-height)*var(--dome-item-size-y));transform-origin:50%;backface-visibility:hidden;transform:rotateY(calc(var(--dome-rot-y)*(var(--dome-offset-x) + ((var(--dome-item-size-x) - 1)/2))))rotateX(calc(var(--dome-rot-x)*(var(--dome-offset-y) - ((var(--dome-item-size-y) - 1)/2))))translateZ(var(--dome-radius));margin:auto;transition:transform .3s;position:absolute;inset:-999px}.dome-item__card{backface-visibility:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;pointer-events:auto;background:#f8f8f8;border:2px solid #00000014;border-radius:12px;justify-content:center;align-items:center;padding:1rem;transition:border-color .3s,box-shadow .3s,transform .3s;display:flex;position:absolute;inset:8px;overflow:hidden;transform:translateZ(0);box-shadow:0 2px 8px #0000000f}.dome-item__card img{object-fit:contain;pointer-events:none;backface-visibility:hidden;filter:grayscale();opacity:.5;max-width:100%;max-height:100%;transition:filter .3s,opacity .3s}.dome-item__card:hover{border-color:#cf0a12;transform:translateZ(0)scale(1.05);box-shadow:0 0 20px #cf0a124d,inset 0 0 10px #cf0a120d}.dome-item__card:hover img{filter:grayscale(0);opacity:1}.dome-edge-fade{z-index:5;pointer-events:none;background:linear-gradient(to bottom,transparent,var(--dome-overlay-color,#fff));height:120px;position:absolute;left:0;right:0}.dome-edge-fade--top{top:0;transform:rotate(180deg)}.dome-edge-fade--bottom{bottom:0}