/* Choice photography sits beside, never inside, the radio label. */
.v3-flow-page .ulpe .ulom-choice-card { display: grid; grid-template-columns: minmax(0, 1fr) 80px; align-items: center; gap: 12px; min-width: 0; padding: 12px 16px; border: 2px solid #d9dfd9; border-radius: 14px; background: #fff; transition: border-color .15s, background-color .15s; }
.v3-flow-page .ulpe .ulom-choice-card.is-selected { background: #f4f7e9; border-color: var(--ulpe-ink, #19243a); box-shadow: 2px 2px 0 var(--ulpe-lime, #c6d7a3); }
.v3-flow-page .ulpe .ulom-choice-card:focus-within { border-color: #526d9e; }
.v3-flow-page .ulpe .ulom-choice-card.is-unavailable { background: #f3f4f7; border-color: #e1e4eb; color: #64718a; }
.v3-flow-page .ulpe .ulom-choice-card.is-selected.is-unavailable { border-color: #b46b52; box-shadow: none; }
.v3-flow-page .ulpe .ulom-choice-card > .ulom-choice-label { align-self: stretch; align-items: center; min-width: 0; min-height: 80px; margin: 0; padding: 4px 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.v3-flow-page .ulpe .ulom-choice-card > .ulom-choice-label input { margin-top: 0; }
.v3-flow-page #v3-local-editor .ulom-choice-card > .ulom-choice-label { padding: 4px 0; }
.v3-flow-page .ulpe .ulom-choice-card > .ulom-choice-label[hidden], .v3-flow-page .ulpe .ulom-choice-card[hidden] { display: none; }
.v3-flow-page .ulpe .ulom-choice-card .ulpe-method-copy { min-width: 0; overflow-wrap: anywhere; }
.v3-flow-page .ulom-gallery-host { min-width: 0; max-width: 100%; }
.v3-flow-page .ulom-choice-card:not(.is-method) .ulom-gallery-host { width: 80px; justify-self: end; }
.v3-flow-page .ulpe .ulom-choice-card.is-method { grid-template-columns: minmax(0, 1fr) minmax(180px, 228px); }
.v3-flow-page .ulom-gallery { min-width: 0; }
.v3-flow-page .ulom-thumbnails { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.v3-flow-page .ulom-gallery:not(.is-method) .ulom-thumbnails { grid-template-columns: minmax(0, 1fr); }
.v3-flow-page .ulom-thumbnail { position: relative; display: block; width: 100%; min-width: 0; min-height: 64px; aspect-ratio: 1; padding: 5px; overflow: hidden; border: 1px solid #dce2db; border-radius: 10px; background: #f9faf6; color: #19243a; cursor: zoom-in; }
.v3-flow-page .ulom-thumbnail img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: 5px; }
.v3-flow-page .ulom-thumbnail:hover { border-color: #19243a; box-shadow: 0 2px 0 #c6d7a3; }
.v3-flow-page .ulom-thumbnail:focus-visible, .ulom-dialog button:focus-visible { outline: 3px solid #3557ff; outline-offset: 3px; }
.v3-flow-page .ulom-thumbnail-badge { position: absolute; top: 3px; left: 3px; display: grid; place-items: center; min-width: 22px; height: 22px; padding: 0 3px; border: 1px solid #e3e7e7; border-radius: 6px; background: #fffffff0; color: #526781; font-size: 16px; line-height: 1; }
.v3-flow-page .ulom-gallery-hint { margin: 4px 0 0; color: #526781; font-size: 16px; font-weight: 500; line-height: 1.5; }
.v3-flow-page .ulom-gallery:not(.is-method) .ulom-gallery-hint { margin-top: 3px; text-align: center; white-space: nowrap; }
.v3-flow-page .ulom-image-error { display: block; padding: 8px 3px 24px; font-size: 16px; line-height: 1.4; }
/* Shape first, material second: distinct sections, the same radio interaction. */
.v3-flow-page #v3-sublimation-picker .ulom-collar-section { margin-top: 20px; margin-bottom: 28px; }
.v3-flow-page #v3-sublimation-picker .ulom-collar-section > legend { margin-bottom: 0; padding: 0; }
.v3-flow-page #v3-sublimation-picker .ulom-collar-section .ulom-section-label { padding: 6px 12px; border-radius: 8px; background: #19243a; color: #fff; }
.v3-flow-page #v3-sublimation-picker .ulom-section-intro { margin: 10px 0 14px; color: #526781; font-size: 16px; line-height: 1.7; }
.v3-flow-page #v3-sublimation-picker .ulom-fabric-section { margin: 0 0 22px; padding: 6px 18px 18px; border: 1px solid #e8ddc4; border-radius: 16px; background: #fbf6e9; }
.v3-flow-page #v3-sublimation-picker .ulom-fabric-section > legend { margin: 0; padding: 0; }
.v3-flow-page #v3-sublimation-picker .ulom-fabric-section .ulom-section-label { padding: 6px 12px; border: 1px solid #e0c975; border-radius: 8px; background: #f4e2a1; color: #59461d; }
.v3-flow-page #v3-sublimation-picker .ulom-fabric-section .ulpe-methods { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.v3-flow-page #v3-sublimation-picker .ulom-choice-card.is-fabric { padding: 12px; border-color: #e1ded2; }
.v3-flow-page #v3-sublimation-picker .ulom-choice-card.is-fabric.is-selected { border-color: #19243a; background: #fff5d6; box-shadow: 2px 2px 0 #e7d491; }
.v3-flow-page #v3-sublimation-picker .ulom-choice-card.is-fabric.is-unavailable { border-color: #e1e4eb; background: #f5f5f2; }
.v3-flow-page #v3-sublimation-picker .ulom-price-context { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.v3-flow-page #v3-sublimation-picker .ulom-price-value { display: block; word-break: keep-all; overflow-wrap: normal; }
.ulom-dialog { box-sizing: border-box; width: min(860px, calc(100vw - 28px)); max-width: calc(100vw - 28px); max-height: calc(100dvh - 28px); margin: auto; padding: 22px; overflow: auto; border: 2px solid #19243a; border-radius: 20px; background: #fffdf5; color: #19243a; font: 18px/1.6 system-ui, sans-serif; box-shadow: 6px 6px 0 #c6d7a3; }
.ulom-dialog::backdrop { background: rgb(13 24 43 / 70%); }
.ulom-dialog-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 14px; }
.ulom-dialog-header h2 { margin: 0; font-size: 24px; line-height: 1.5; }
.ulom-dialog button { min-width: 44px; min-height: 44px; padding: 8px 12px; border: 1px solid #19243a; border-radius: 10px; background: #fff; color: #19243a; font: inherit; cursor: pointer; }
.ulom-dialog-close { flex-shrink: 0; }
.ulom-dialog-figure { margin: 0; }
.ulom-dialog-image { display: block; width: 100%; height: min(55dvh, 520px); object-fit: contain; border: 1px solid #d9dfe1; border-radius: 12px; background: #fff; }
.ulom-dialog-figure figcaption { margin-top: 10px; font-weight: 700; }
.ulom-dialog-status { margin: 6px 0 14px; color: #526781; font-size: 16px; line-height: 1.6; }
.ulom-dialog-navigation { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.ulom-dialog-step:disabled { opacity: .45; cursor: default; }
.ulom-dialog-counter { font-size: 16px; white-space: nowrap; }
.ulom-dialog [hidden] { display: none; }
@media (min-width: 761px) and (max-width: 1200px) {
  .v3-flow-page #v3-sublimation-picker .ulom-fabric-section .ulpe-methods { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .v3-flow-page #v3-sublimation-picker .ulom-fabric-section .ulom-choice-card:last-child { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .v3-flow-page #v3-sublimation-picker .ulpe-methods,
  .v3-flow-page #v3-sublimation-picker .ulom-fabric-section .ulpe-methods { grid-template-columns: minmax(0, 1fr); }
  .v3-flow-page #v3-sublimation-picker .ulom-fabric-section { padding: 6px 12px 12px; }
}
@media (max-width: 620px) {
  .v3-flow-page .ulpe .ulom-choice-card { gap: 10px; padding: 12px; }
  .v3-flow-page .ulpe .ulom-choice-card.is-method { grid-template-columns: minmax(0, 1fr); }
  .v3-flow-page .ulpe .ulom-choice-card.is-method > .ulom-choice-label { min-height: 44px; }
  .v3-flow-page .ulom-choice-card.is-method .ulom-gallery-host { width: 228px; max-width: calc(100% - 28px); margin-left: 28px; }
  .ulom-dialog { padding: 14px; border-radius: 15px; }
  .ulom-dialog-header h2 { font-size: 20px; }
  .ulom-dialog button { padding: 8px; font-size: 16px; }
  .ulom-dialog-image { height: min(48dvh, 420px); }
}
@media (prefers-reduced-motion: reduce) {
  .v3-flow-page .ulpe .ulom-choice-card { transition: none; }
}
/* A single, quiet helper beside the method heading; never inside a radio card. */
.v3-flow-page #v3-local-editor .ulom-method-section { position: relative; }
.v3-flow-page #v3-local-editor .ulom-method-legend { position: absolute; width: 1px; height: 1px; margin: 0; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.v3-flow-page #v3-local-editor .ulom-method-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px 20px; min-width: 0; margin-bottom: 14px; }
.v3-flow-page #v3-local-editor .ulom-method-heading > .ulpe-step-title { flex: 1 1 260px; min-width: 0; margin: 0; }
.v3-flow-page #v3-local-editor .ulom-method-companion { display: flex; align-items: center; gap: 8px; flex: 0 1 auto; min-width: 0; max-width: 100%; }
.v3-flow-page #v3-local-editor .ulom-method-companion[hidden] { display: none; }
.v3-flow-page #v3-local-editor .ulom-method-reminder-text { min-width: 0; margin: 0; padding: 8px 12px; border: 1px solid #dce5cb; border-radius: 12px; background: #f4f7e9; color: #466527; font-size: 16px; font-weight: 600; line-height: 1.6; overflow-wrap: anywhere; }
@media (max-width: 760px) {
  .v3-flow-page #v3-local-editor .ulom-method-heading > .ulpe-step-title { flex-basis: 100%; }
  .v3-flow-page #v3-local-editor .ulom-method-companion { flex-basis: 100%; justify-content: flex-start; }
  .v3-flow-page #v3-local-editor .ulom-method-reminder-text { flex: 0 1 auto; }
}
/* Two small, unmistakable choices: first the garment, then the class color. */
.v3-flow-page #v3-local-editor .ulom-product-field { gap: 10px; padding: 14px; border: 1px solid #d7e0f1; border-radius: 12px; background: #f1f5ff; }
.v3-flow-page #v3-local-editor .ulom-product-field.is-color { border-color: #eadbb8; background: #fff8e7; }
.v3-flow-page #v3-local-editor .ulom-product-field-heading { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; font-size: 18px; line-height: 1.6; }
.v3-flow-page #v3-local-editor .ulom-product-step { display: inline-grid; flex: 0 0 28px; width: 28px; height: 28px; place-items: center; border-radius: 8px; color: #fff; background: #35528b; font-size: 16px; line-height: 1; font-weight: 800; }
.v3-flow-page #v3-local-editor .is-color .ulom-product-step { color: #59461d; background: #ebd58a; }
.v3-flow-page #v3-local-editor .ulom-product-field-name { min-width: 0; flex: 1 1 auto; color: #253c73; font-size: 18px; font-weight: 800; }
.v3-flow-page #v3-local-editor .is-color .ulom-product-field-name { color: #6b511c; }
.v3-flow-page #v3-local-editor .ulom-product-state { display: inline-block; max-width: 100%; margin-left: auto; padding: 2px 8px; border: 1px solid #d1dbea; border-radius: 999px; color: #526781; background: #fff; font-size: 16px; font-weight: 600; line-height: 1.6; overflow-wrap: anywhere; }
.v3-flow-page #v3-local-editor .ulom-product-field.is-complete .ulom-product-state { color: #466527; border-color: #b8ca9f; background: #f5faed; }
.v3-flow-page #v3-local-editor .ulom-product-field.is-carried .ulom-product-state { color: #6b511c; border-color: #d9c791; background: #fffdf5; }
.v3-flow-page #v3-local-editor .ulom-product-field-help { color: #526781; font-size: 16px; font-weight: 500; line-height: 1.7; overflow-wrap: anywhere; }
.v3-flow-page #v3-local-editor .ulom-product-field select { max-width: 100%; min-width: 0; font-size: 18px; }
@media (max-width: 380px) {
  .v3-flow-page #v3-local-editor .ulom-product-field { padding: 12px; }
  .v3-flow-page #v3-local-editor .ulom-product-field-heading { gap: 6px; }
}
/* Add and edit in the same place as the single interactive shirt preview. */
.v3-flow-page #v3-local-editor .ulpe-preview-tools { margin: 14px 0; padding: 12px; border: 1px solid #d5dcc5; border-radius: 12px; background: #fcfcfa; text-align: left; }
.v3-flow-page #v3-local-editor.is-assistance .ulpe-preview-tools { display: none; }
.v3-flow-page #v3-local-editor .ulpe-preview-tools .ulpe-add-actions { grid-template-columns: minmax(0, 1fr); }
.v3-flow-page #v3-local-editor .ulpe-preview-tools .ulpe-button { min-height: 48px; padding: 9px 10px; font-size: 16px; }
.v3-flow-page #v3-local-editor .ulpe-upload[aria-disabled="true"] { opacity: .55; cursor: wait; }
.v3-flow-page #v3-local-editor .ulpe-preview-tools :is(.ulpe-file-help, .ulpe-status) { margin: 8px 0 0; font-size: 16px; line-height: 1.65; }
.v3-flow-page #v3-local-editor .ulpe-preview-rail { overflow-anchor: none; }
.v3-flow-page #v3-local-editor .ulpe-preview > .ulpe-adjustments { margin: 16px 0; padding: 14px 4px 0; border-top: 1px solid #d5dcc5; text-align: left; }
.v3-flow-page #v3-local-editor .ulpe-adjustments > .ulpe-error { position: absolute; width: 1px; height: 1px; margin: 0; padding: 0; border: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.v3-flow-page #v3-local-editor .ulpe-preview > .ulpe-stage { margin-top: 12px; }
.v3-flow-page #v3-local-editor .ulpe-next-choice-guide { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0 0; padding: 14px; border: 1px solid #b8c9e0; border-radius: 12px; background: #edf3fc; }
.v3-flow-page #v3-local-editor .ulpe-next-choice-copy { flex: 1 1 100%; margin: 0; color: #304f7b; font-size: 16px; font-weight: 650; line-height: 1.65; }
.v3-flow-page #v3-local-editor :is(.ulpe-next-choice-button,.ulpe-setup-next) { min-height: 46px; border-color: #375880; background: #375880; color: #fff; font-size: 16px; }
.v3-flow-page #v3-local-editor :is(.ulpe-next-choice-button,.ulpe-setup-next):hover:not(:disabled) { background: #284363; }
.v3-flow-page #v3-local-editor .ulpe-garment-choice-button { min-height: 46px; color: #375880; border-color: #a5b8d3; font-size: 16px; }
.v3-flow-page #v3-local-editor .ulpe-setup-next { display: flex; width: 100%; margin: 10px 0; }
.v3-flow-page #v3-local-editor.is-assistance .ulpe-setup-next { display: none; }
.v3-flow-page #v3-local-editor.is-assistance .ulpe.is-awaiting-method .ulpe-preview-rail { display: none; }
.v3-flow-page #v3-local-editor.is-assistance .ulpe.is-awaiting-method .ulpe-workspace { grid-template-columns: minmax(0, 1fr); }
.v3-flow-page #v3-local-editor #v3-reuse-reference { width: 100%; margin-top: 10px; }
@media (max-width: 440px) {
  .v3-flow-page #v3-local-editor .ulpe-preview-tools { padding: 10px; }
  .v3-flow-page #v3-local-editor .ulpe-preview-tools .ulpe-add-actions { grid-template-columns: minmax(0, 1fr); }
}
/* In self-design mode the phone shows the shirt/upload before the long choices. */
@media (max-width: 1000px) {
  .v3-flow-page #v3-local-editor:not(.is-assistance) .ulpe-workspace > .ulpe-preview-rail { grid-column: 1; grid-row: 1; }
  .v3-flow-page #v3-local-editor:not(.is-assistance) .ulpe-workspace > .ulpe-settings { grid-column: 1; grid-row: 2; }
  .v3-flow-page #v3-local-editor .ulpe-next-choice-guide .ulpe-button { flex: 1 1 180px; }
}
@media (min-width: 1001px) and (max-height: 850px) {
  .v3-flow-page #v3-local-editor .ulpe-preview-rail { position: static; }
}
/* Confirmed/editing copy changes must not shift the entire editor mid-drag. */
.v3-flow-page #v3-design-note { min-height: 3.6em; }
@media (max-width: 640px) {
  .v3-flow-page #v3-design-note { min-height: 7.2em; }
}