.ui-pad-field{gap:var(--s-1);display:grid}.ui-pad{aspect-ratio:16/9;min-height:var(--hit);margin-top:var(--s-1);border-radius:var(--r-sm);background:repeating-linear-gradient(to right, var(--hair) 0 var(--bw-hair), transparent 0 25%), repeating-linear-gradient(to bottom, var(--hair) 0 var(--bw-hair), transparent 0 25%), var(--bg-sunken);box-shadow:inset 0 0 0 var(--bw-hair) var(--edge);cursor:crosshair;touch-action:none;-webkit-user-select:none;user-select:none;position:relative}.ui-pad:focus-visible{outline:var(--ring);outline-offset:var(--ring-offset)}.ui-pad>span,.ui-pad:before,.ui-pad:after,.ui-pad-cross:before,.ui-pad-cross:after{pointer-events:none;position:absolute}.ui-pad:before,.ui-pad:after,.ui-pad-cross:before,.ui-pad-cross:after{content:"";background:var(--hair-strong);inset:0}.ui-pad-cross:before,.ui-pad-cross:after{background:var(--edge)}.ui-pad:before{width:var(--bw-hair);left:50%}.ui-pad:after{height:var(--bw-hair);top:50%}.ui-pad-cross{inset:0}.ui-pad-cross:before{left:var(--pad-x);width:var(--bw-hair)}.ui-pad-cross:after{top:var(--pad-y);height:var(--bw-hair)}.ui-pad-default{left:var(--pad-default-x);top:var(--pad-default-y);inline-size:var(--s-3);aspect-ratio:1;border:var(--bw-hair) solid var(--fg-muted);border-radius:var(--r-full);translate:-50% -50%}.ui-pad-thumb{left:var(--pad-x);top:var(--pad-y);inline-size:var(--s-5);aspect-ratio:1;border-radius:var(--r-full);background:var(--learner);box-shadow:0 0 0 var(--bw-hair) var(--bg-raised);translate:-50% -50%}