.env-picker{border:0;padding:0;margin:18px 0;min-width:0}.env-picker legend{font-size:.9rem;font-weight:600;margin-bottom:10px}.env-picker__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.env-picker__choice{position:relative;display:flex!important;flex-direction:column;gap:7px;cursor:pointer;min-width:0;font-size:11px!important;line-height:1.3;text-align:center;font-weight:400!important;padding:7px!important;border:1px solid #b6b0a34d;border-radius:10px;color:inherit!important;letter-spacing:0!important;text-transform:none!important}.env-picker__choice:has(input:checked){border-color:currentColor;box-shadow:0 0 0 1px currentColor}.env-picker__choice input{position:absolute!important;opacity:0;width:1px!important;height:1px!important}.env-picker__choice:focus-within{outline:2px solid #a5844e;outline-offset:3px}.env-picker__sample{position:relative;display:grid;place-items:center;height:70px;background:#eee7d9;border-radius:5px;overflow:hidden}.env-picker__sample img{width:100%;height:100%;object-fit:contain}.env-picker__auto{font:35px Georgia;color:#71644b}.env-picker__choice[data-env-family=midnight] .env-picker__sample,.env-picker__choice[data-env-family=celestial] .env-picker__sample{background:#28333a}
/* Envelope 2.0 stamp choice (design | monogram | photo): text-only choices, one equal column each. */
.env-picker--stamp .env-picker__grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}.env-picker--stamp .env-picker__choice{justify-content:center;min-height:44px;font-size:12px!important}.env-picker__hint{margin:8px 0 0;font-size:12px;line-height:1.45;opacity:.72}
/* The stamp photo control under the stamp choice (MakateebStampPhoto in design-images.js), both editors. */
.env-stamp-photo{display:flex;gap:12px;align-items:flex-start;margin-top:10px;padding:10px;border:1px dashed #b6b0a380;border-radius:10px}.env-stamp-photo[hidden]{display:none}.env-stamp-photo__thumb{flex:0 0 56px;width:56px;height:70px;display:grid;place-items:center;overflow:hidden;background:#eee7d9;border:3px solid #fcf8ef;outline:1px solid #b6b0a399;border-radius:2px}.env-stamp-photo__thumb img{width:100%;height:100%;object-fit:cover}.env-stamp-photo__thumb.is-empty{background:repeating-linear-gradient(45deg,#eee7d9 0 6px,#e5dccb 6px 12px)}.env-stamp-photo__body{flex:1;min-width:0}.env-stamp-photo__title{margin:0 0 4px;font-size:12px;font-weight:600}.env-stamp-photo__note{margin:0 0 8px;font-size:12px;line-height:1.45;opacity:.72}.env-stamp-photo__actions{display:flex;flex-wrap:wrap;gap:6px}.env-stamp-photo__actions [hidden]{display:none!important}.env-stamp-photo__status{margin:6px 0 0;font-size:12px}.env-stamp-photo__status:empty{display:none}
/* Envelope 2.0 (--v2, inc/envelope_families.php): each family is its real front - a tall still in the page's script -
   and each stamp choice a still of that stamp as printed. Columns fill the width (3 on a phone, more in a wide
   column) and a tile keeps the front's own shape, so nothing is cropped. [hidden] must beat display:flex!important
   ("Initials" is hidden without two host names). */
.env-picker--v2 .env-picker__choice[hidden]{display:none!important}
.env-picker--v2[data-env-picker]{container:envpick/inline-size}
.env-picker--v2[data-env-picker] .env-picker__grid{grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:10px 8px}
/* a wide column (desktop editors): 5 + 4 tiles of phone size, not 6 + 3 or 7 + 2 stretched ones */
@container envpick (min-width:480px){.env-picker--v2[data-env-picker] .env-picker__grid{grid-template-columns:repeat(5,minmax(0,104px))}}
.env-picker--v2[data-env-picker] .env-picker__choice{padding:6px 6px 8px!important}
.env-picker--v2[data-env-picker] .env-picker__sample{height:auto;aspect-ratio:360/779;border-radius:4px;box-shadow:0 1px 2px #2a211424,0 6px 12px -8px #2a211466}
.env-picker--v2[data-env-picker] .env-picker__sample img{display:block;width:100%;height:100%;object-fit:cover}
/* "Match invitation": the resolved family's front (envelope-picker.js) with the arrow as a small badge, and that
   family's name on its own line; the " · " between them is for screen readers ("Match invitation · Botanical"). */
.env-picker--v2 .env-picker__sample.is-resolved .env-picker__auto{position:absolute;inset-block-start:5px;inset-inline-start:5px;width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:#fffffff0;box-shadow:0 1px 3px #0003;font:14px/1 Georgia,serif}
.env-picker--v2 .env-picker__resolved{display:block;opacity:.72}
.env-picker--v2 .env-picker__resolved[hidden]{display:none}
.env-picker__sep{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.env-picker__sample--stamp{height:78px;background:#eee7d9}
/* (absolute: a percentage height on a grid item in an auto track is ignored, and the stamp was cropped) */
.env-picker__sample--stamp img{position:absolute;top:8px;left:0;width:100%;height:calc(100% - 16px);object-fit:contain;filter:drop-shadow(0 1px 1.5px #2a211440)}
.env-picker--stamp.env-picker--v2 .env-picker__grid{grid-auto-columns:minmax(0,150px)}
.env-picker--stamp.env-picker--v2 .env-picker__choice{justify-content:flex-start;padding:6px 6px 8px!important}
.env-picker__choice.is-unavailable .env-picker__sample--stamp img{opacity:.45}
