.monogram-modal__inner-wrapper{position:fixed;inset:0;z-index:var(--z-index-popups);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity var(--transition-small)}@media(min-width:1024px){.monogram-modal__inner-wrapper{padding:var(--gutter)}}.monogram-modal[open] .monogram-modal__inner-wrapper{opacity:1}
.monogram-modal__inner{position:relative;width:100%;height:100%;overflow-y:auto;overscroll-behavior:contain;color:var(--color-black);background:var(--color-white)}@media(min-width:1024px){.monogram-modal__inner{display:flex;flex-direction:column;max-width:908px;height:min(700px,100%);overflow:hidden}}.monogram-modal__header{position:sticky;top:0;z-index:2;display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-16);padding:var(--space-32) var(--gutter) var(--space-20);background:var(--color-white)}
@media(min-width:1024px){.monogram-modal__header{position:static;flex-shrink:0;padding:var(--space-40) var(--space-40) var(--space-16)}}.monogram-modal__title{margin:0}.monogram-modal__close{display:flex;flex-shrink:0;padding:0;color:inherit;background:0;border:0;cursor:pointer}.monogram-modal__close svg{display:block;width:20px;height:20px}
@media(min-width:1024px){.monogram-modal__content{flex:1 1 auto;min-height:0}}monogram-configurator{display:block;height:100%}@media(min-width:1024px){.monogram{display:grid;grid-template-columns:minmax(0,54fr) minmax(0,46fr);height:100%}}.monogram__preview{aspect-ratio:1;background:var(--color-grey-100)}@media(min-width:1024px){.monogram__preview{aspect-ratio:auto;min-height:0}
}.monogram__options{display:flex;flex-direction:column;gap:var(--space-24);padding:var(--space-24) var(--gutter) var(--space-40)}@media(min-width:1024px){.monogram__options{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:0 var(--space-40) var(--space-40) var(--space-32)}}.monogram__type{margin:0}
.monogram__error{margin:calc(var(--space-12) - var(--space-24)) 0 0;color:var(--color-error)}.monogram__notes{color:var(--color-black)}.monogram__notes p{margin:0}.monogram-preview{--monogram-gold:#fcd478;container-type:size;display:flex;align-items:center;justify-content:center;width:100%;height:100%;overflow:hidden}.monogram-preview__box{position:relative;container-type:inline-size;width:min(100cqw,100cqh * var(--monogram-image-ratio));aspect-ratio:var(--monogram-image-ratio)}
.monogram-preview__image{display:block;width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.monogram-preview__text{position:absolute;line-height:1;text-box:trim-both cap alphabetic;white-space:nowrap;pointer-events:none}.monogram-preview__text--gold-foil{color:var(--monogram-gold)}.monogram-preview__text--hand-painted{text-shadow:-0.046em .015em var(--monogram-shadow-color,transparent)}
.monogram-types{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));min-width:0;margin:0;padding:0;border:0}.monogram-types__option{position:relative;cursor:pointer}.monogram-types__input{position:absolute;opacity:0;pointer-events:none}.monogram-types__label{display:flex;align-items:center;justify-content:center;height:52px;padding:0 var(--space-16);color:var(--color-black);background:var(--color-white);border:1px solid var(--color-black);text-align:center;transition:color var(--transition-small),background-color var(--transition-small)}
.monogram-types__input:checked+.monogram-types__label{color:var(--color-white);background:var(--color-black)}.monogram-types__input:focus-visible+.monogram-types__label{outline:2px solid var(--color-focus);outline-offset:2px}.monogram-accordion{border-bottom:1px solid var(--color-black)}.monogram-accordion__heading{margin:0}
.monogram-accordion__toggle{display:flex;align-items:center;justify-content:space-between;gap:var(--space-16);width:100%;padding:var(--space-16) var(--space-4);color:inherit;background:0;border:0;text-align:left;cursor:pointer}.monogram-accordion__icon{flex-shrink:0}.monogram-accordion--open .monogram-accordion__icon{transform:rotate(180deg)}
.monogram-accordion__panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--transition-small)}.monogram-accordion--open .monogram-accordion__panel{grid-template-rows:1fr}.monogram-accordion__panel-inner{min-height:0;overflow:hidden}.monogram-accordion__content{padding:var(--space-4) var(--space-4) var(--space-24)}
.monogram-text{display:flex;flex-direction:column;gap:var(--space-16)}.monogram-text__entry{display:flex;flex-direction:column;gap:var(--space-16)}.monogram-text__phrases{padding-left:calc(18px + var(--space-8))}.monogram-text .field{gap:var(--space-8)}.monogram-text__input{border-color:var(--color-grey-300)}.monogram-text__input::-moz-placeholder{color:var(--color-grey-600)}
.monogram-text__input::placeholder{color:var(--color-grey-600)}.monogram-text__input:focus{border-color:var(--color-black)}.monogram-text__hint{margin:0;color:var(--color-grey-600)}.monogram-options{display:flex;flex-direction:column;gap:var(--space-16)}.monogram-option{position:relative}.monogram-size{display:flex;flex-direction:column;gap:var(--space-4)}
.monogram-size__hint{margin:0;padding-left:calc(16px + var(--space-8));color:var(--color-grey-600)}.monogram-font__name,.monogram-font__preview{font-size:calc(20px * var(--monogram-font-scale, 1));line-height:1.2;text-transform:uppercase}.monogram-font__preview{margin-left:auto}.monogram-colors{display:flex;flex-direction:column;gap:var(--space-24)}
.monogram-swatches{min-width:0;margin:0;padding:0;border:0}.monogram-swatches__legend{margin-bottom:var(--space-12);padding:0}.monogram-swatches__legend strong{font-weight:700}.monogram-swatches__list{display:flex;flex-wrap:wrap;gap:var(--space-16)}.monogram-swatch{position:relative;width:34px;height:34px;cursor:pointer}
.monogram-swatch:has(:disabled){cursor:not-allowed}.monogram-swatch__input{position:absolute;opacity:0;pointer-events:none}.monogram-swatch__dot{position:relative;display:block;width:100%;height:100%;border-radius:100%;transition:opacity var(--transition-small)}.monogram-swatch__dot::before{content:"";position:absolute;inset:3px;border-radius:100%;background:var(--swatch-color);box-shadow:inset 0 0 0 1px var(--color-grey-300)}
.monogram-swatch__dot::after{content:"";position:absolute;inset:0;border-radius:100%;box-shadow:inset 0 0 0 1px var(--color-black);opacity:0;transition:opacity var(--transition-small);pointer-events:none}.monogram-swatch__dot--none::before{background:linear-gradient(to top right,transparent calc(50% - 0.5px), var(--color-black) calc(50% - 0.5px), var(--color-black) calc(50% + 0.5px), transparent calc(50% + 0.5px)), var(--color-white)}
.monogram-swatch__input:checked+.monogram-swatch__dot::after{opacity:1}.monogram-swatch__input:focus-visible+.monogram-swatch__dot{outline:2px solid var(--color-focus);outline-offset:1px}.monogram-swatch__input:disabled+.monogram-swatch__dot{opacity:.3}@media(hover:hover) and (pointer:fine){.monogram-swatch:hover .monogram-swatch__input:not(:disabled)+.monogram-swatch__dot::after{opacity:1}
}