.grain-field{z-index:-1;border-radius:inherit;pointer-events:none;width:100%;height:100%;display:block;position:absolute;inset:0}.grain-picker{flex:none;position:relative}.grain-picker__button{cursor:pointer;background:#0a0a0a42;border:0;border-radius:9999px;justify-content:center;align-items:center;width:28px;height:28px;padding:0;transition:background-color .15s;display:inline-flex}.grain-picker__button:focus,.grain-picker__button:focus-visible{outline:none}.grain-picker__button:focus-visible,.grain-picker[data-open] .grain-picker__button{background:#0a0a0a7a}@media (hover:hover) and (pointer:fine){.grain-picker__button:hover{background:#0a0a0a6b}}.grain-picker__swatch{background-position:50%;background-size:cover;border-radius:9999px;flex:none;width:18px;height:18px;transition:transform .15s;box-shadow:inset 0 0 0 1px #ffffff8c}.grain-picker[data-open] .grain-picker__swatch{transform:scale(1.12)}.grain-picker__menu{z-index:30;-webkit-backdrop-filter:blur(20px)saturate(150%);backdrop-filter:blur(20px)saturate(150%);color:#fff;text-align:left;transform-origin:100% 0;background:#16181cc7;border-radius:16px;width:252px;max-width:calc(100vw - 24px);padding:6px;animation:.14s cubic-bezier(.2,.8,.2,1) grain-picker-in;position:absolute;top:calc(100% + 8px);right:0;box-shadow:inset 0 0 0 1px #ffffff1f,0 24px 48px -16px #0000008c}@keyframes grain-picker-in{0%{opacity:0;transform:translateY(-4px)scale(.97)}}.grain-picker__head{letter-spacing:.08em;text-transform:uppercase;color:#ffffff8c;margin:0;padding:6px 10px;font-size:11px;font-weight:600}.grain-picker__list{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#ffffff40 transparent;max-height:min(66vh,520px);position:relative;overflow-y:auto}.grain-picker__list:focus,.grain-picker__list:focus-visible{outline:none}.grain-picker__option{cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:10px;align-items:center;gap:10px;height:36px;padding:0 10px 0 7px;font-size:13.5px;font-weight:500;display:flex}.grain-picker__option--active{background:#ffffff1c}.grain-picker__option[aria-selected=true]{font-weight:600}.grain-picker__thumb{background-position:50%;background-size:cover;border-radius:7px;flex:none;width:24px;height:24px;box-shadow:inset 0 0 0 1px #ffffff2e}.grain-picker__name{white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;overflow:hidden}.grain-picker__tag{color:#ffffffbf;background:#ffffff1f;border-radius:9999px;flex:none;padding:2px 7px;font-size:11px;font-weight:500}.grain-picker__check{flex:none}@media (prefers-reduced-motion:reduce){.grain-picker__menu{animation:none}.grain-picker__swatch{transition:none}}