.grid-plot-wrap{margin-top:20px}.grid-axis-label{text-align:center;color:var(--fg-subtle);margin:4px 0;font-size:.72rem;font-weight:700}.grid-plot{aspect-ratio:1;border-radius:var(--r-md);border:1px solid var(--card-border);background:rgb(var(--ink) / .03);width:100%;max-width:320px;margin:0 auto;position:relative;overflow:hidden}.grid-plot:before,.grid-plot:after{content:"";background:var(--card-border);position:absolute}.grid-plot:before{width:1px;top:0;bottom:0;left:50%}.grid-plot:after{height:1px;top:50%;left:0;right:0}.grid-quadrant-label{letter-spacing:.03em;text-transform:uppercase;color:var(--fg-subtle);max-width:45%;padding:8px;font-size:.66rem;font-weight:800;line-height:1.3;position:absolute}.q-tl{top:0;left:0}.q-tr{text-align:right;top:0;right:0}.q-bl{bottom:0;left:0}.q-br{text-align:right;bottom:0;right:0}.grid-dot{background:var(--accent-gradient);border-radius:50%;width:18px;height:18px;transition:left .9s cubic-bezier(.22,1,.36,1),top .9s cubic-bezier(.22,1,.36,1);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 5px #38bdf838,0 0 18px #38bdf880}.grid-axis-row{max-width:320px;color:var(--fg-subtle);justify-content:space-between;margin:8px auto 0;font-size:.7rem;display:flex}