/* Dorax Finance — Dorax's own 3D icons (ui/dx-icons.js, v309) and the choice of one in a goal's form. */
.dxi { display: block; flex: none; overflow: visible; }
.g-icons .dx-say { display: block; margin: 2px 0 10px; color: var(--ink-3); font-size: 12.5px; }
.dx-pick { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.dx-pick button { all: unset; box-sizing: border-box; cursor: pointer; -webkit-tap-highlight-color: transparent; display: grid; place-items: center; height: 72px; border-radius: 18px; background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line); transition: box-shadow 140ms ease-out, background 140ms ease-out, transform 120ms ease-out; }
.dx-pick button .dxi { width: 44px; height: 44px; }
.dx-pick button[aria-checked="true"] { background: var(--select); box-shadow: inset 0 0 0 2px var(--brand); }
.dx-pick button:active { transform: scale(.96); }
.dx-pick button:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .dx-pick button { transition: none; } }
/* v313: one of Dorax's icons on a category's or a fixed cost's circle: standing free, filling it */
.cg.dx { background: none; }
.cg.dx .dxi { width: 100%; height: 100%; }
.dx-grid .cgi-b .dxi { width: 40px; height: 40px; }