.visual-color-field{min-width:0}.visual-color-field>label{font-size:12px}.color-swatch-trigger{display:flex;align-items:center;gap:12px;width:100%;min-height:49px;margin-top:7px;padding:8px 11px;border:1px solid #c9cec2;border-radius:5px;background:var(--white);color:var(--ink);text-align:left;font:13px Arial}.color-swatch-trigger:hover,.color-swatch-trigger[aria-expanded=true]{border-color:var(--green)}.visual-color-chip{display:grid;place-items:center;flex-shrink:0;width:32px;height:30px;border:1px solid #0002;border-radius:4px}.pairing-letter{font:bold 16px Georgia}.selected-color-name{flex:1;min-width:0;line-height:1.35}.swatch-arrow{font:18px Arial;color:var(--muted);padding:0 2px}.color-swatch-menu{position:fixed;z-index:1000;display:flex;flex-direction:column;padding:0;background:var(--white);color:var(--ink);border:1px solid #c9cec2;border-radius:9px;box-shadow:0 10px 36px #203c3029;overflow:hidden}.swatch-menu-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 15px 12px;border-bottom:1px solid var(--line);flex-shrink:0}.swatch-menu-heading strong{font:600 12px Arial}.swatch-menu-heading>span{font:10px Arial;color:var(--muted)}.color-swatch-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;padding:10px;overflow:auto;min-height:0;overscroll-behavior:contain;scrollbar-gutter:stable}.color-swatch-option{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:start;gap:7px;min-width:0;min-height:73px;padding:7px 3px 5px;border:1px solid transparent;border-radius:5px;background:transparent;color:var(--ink);text-align:center}.color-swatch-option:hover{background:#f0f1e8}.color-swatch-option[aria-selected=true]{border-color:var(--green);background:#eef2ea}.color-swatch-option:focus-visible{outline:2px solid #ad7a45;outline-offset:-2px}.color-swatch-option .visual-color-chip{width:43px;max-width:100%;height:31px}.swatch-option-name{font:10px/1.25 Arial;overflow-wrap:anywhere}.swatch-selected-mark{display:none;position:absolute;right:2px;top:2px;width:16px;height:16px;align-items:center;justify-content:center;border-radius:50%;background:var(--green);color:#fff;font:bold 10px Arial}.color-swatch-option[aria-selected=true] .swatch-selected-mark{display:flex}@media(max-width:480px){.color-swatch-list{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.color-swatch-option{min-height:72px}.color-swatch-trigger{min-height:48px}.swatch-menu-heading{padding:12px}.visual-color-field>label{font-size:11px}}