/* Kompaktowe imię na START; kreatory pary zachowują dotychczasowy układ. */
body.page-stage0 .wizard-start--compact-inspiration:has(.wizard-start-inspirations) .wizard-inspiration-name[hidden] {
    display: flex !important;
    visibility: hidden;
}

body.page-stage0 .wizard-start--compact-inspiration .wizard-inspiration-name {
    display: grid;
    grid-template-columns: max-content minmax(0, 170px);
    align-items: center;
    gap: 6px 10px;
    margin-block: 4px !important;
}

body.page-stage0 .wizard-start--compact-inspiration .wizard-inspiration-name .form-label {
    margin: 0;
    color: #626b73;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
}

body.page-stage0 .wizard-start--compact-inspiration .wizard-inspiration-name .form-control {
    flex: 0 1 170px;
    width: 170px;
    max-width: 100%;
    min-width: 0;
    height: 34px;
    min-height: 34px;
    padding: 4px 9px;
    border: 1px solid #ced4da;
    border-color: #ced4da !important;
    border-radius: 6px;
    background: #fff;
    box-shadow: none;
    font-size: 16px;
    line-height: 24px;
}

body.page-stage0 .wizard-start--compact-inspiration .wizard-inspiration-name .form-control:focus {
    border-color: #d58ba4 !important;
    box-shadow: 0 0 0 2px rgba(213, 139, 164, .16) !important;
    outline: 0;
}

@media (max-width: 399.98px) {
    body.page-stage0 .wizard-start--compact-inspiration .wizard-inspiration-name { grid-template-columns: minmax(0, 1fr); }
}



body.wizard-page .attribute-edit-position {
    margin: .35rem 0 .65rem;
    color: #b83265;
    font-weight: 600;
    font-size: .78rem;
    scroll-margin-top: 1rem;
}
body.wizard-page .attribute-progress { margin-top: .75rem; }
body.wizard-page .attribute-progress:not(:has(p:not(:empty):not([hidden]), button:not([hidden]))) { margin-top: 0; }
body.wizard-page .attribute-progress p { margin: .25rem 0; color: #52606d; font-size: .85rem; }
body.wizard-page .attribute-progress [data-attribute-progress-status] { color: #286746; }
body.wizard-page .attribute-progress p:empty { display: none; }
body.wizard-page .attribute-progress button { margin-top: .5rem; min-height: 44px; }
body.wizard-page .attribute-progress [hidden] { display: none !important; }
.wizard-preview-collapse { display: none; }
/* OTO nadal wymaga podpisu w istniejącej walidacji atrybutu. */
body.wizard-project-oto-on.page-stage3 .attribute-description-optional { display: none; }
@media (max-width: 767.98px) {
    body.wizard-page .stage-shell .wizard-preview-collapse:not([hidden]) {
        display: block;
        margin: .15rem 0 0 auto;
        min-height: 32px;
        flex-shrink: 0;
        padding: .2rem .3rem;
        border: 0;
        border-radius: .4rem;
        background: transparent;
        color: #8f3151;
        font: inherit;
        font-size: .7rem;
    }
    body.wizard-page .stage-shell .wizard-mobile-preview--collapsed > :not(.wizard-project-preview-heading):not(.wizard-preview-collapse) { display: none !important; }
    body.wizard-page .stage-shell .wizard-mobile-preview--collapsed { margin-bottom: .6rem !important; }
    body.wizard-page .stage-shell :is(.text-muted, .form-text) { color: #53616e !important; }
}
.attribute-source-back { display: none; }
body.wizard-project-oto-on.page-stage3 [data-source-mode="custom"] .attribute-source-back { display: inline-flex; }

body.wizard-page.wizard-project-oto-on.page-stage3 .stage-shell--oto-attributes .attribute-category-filter + .wizard-featured-category-label {
    border: 2px dashed #268298;
}

/* Stan limitu korzysta z tych samych wartości co walidacja serwerowa. */
.stage2-example-toggle { display: none; }

body.page-stage2 .stage-shell--photo-attributes .custom-character-attempt-info {
    padding: .2rem 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    font-size: .78rem;
    line-height: 1.4;
    text-align: center;
}

@media (max-width: 767.98px) {
    /* Kategorie pozostają w jednym panelu, niezależnie od liczby wyników. */
    body.wizard-page.wizard-stage-0 .stage-shell .wizard-start-profile-picker__list {
        position: static;
        width: 100%;
        height: auto;
        max-height: min(22rem, 48vh);
        max-height: min(22rem, 48dvh);
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-gutter: stable;
        align-content: start;
        margin-top: .35rem;
    }
    body.wizard-page.wizard-stage-0 .wizard-start-profile-search {
        position: sticky;
        top: -.2rem;
        z-index: 2;
        background: #fff;
    }
    body.wizard-page.wizard-stage-0 .wizard-start-profile-search__input { min-height: 44px; font-size: 16px; }
    body.wizard-page.wizard-stage-0 .wizard-start-profile-picker__option { min-height: 44px; }

    body.page-stage2 .stage-shell .stage2-custom-example[data-mobile-example] { position: relative; }
    body.page-stage2 .stage-shell .stage2-custom-example.is-compact { max-width: 15rem; justify-self: center; }
    body.page-stage2 .stage-shell .stage2-custom-example.is-compact .stage2-custom-example__media { height: 112px; aspect-ratio: auto; }
    body.page-stage2 .stage2-example-toggle:not([hidden]) {
        display: grid;
        place-items: center;
        position: absolute;
        right: 0;
        top: 0;
        z-index: 1;
        width: 44px;
        height: 44px;
        padding: 0;
        border: 1px solid var(--wizard-border);
        border-radius: .6rem;
        background: rgba(255, 255, 255, .94);
        color: var(--wizard-primary-dark, #a5224a);
    }
    .stage2-example-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
    .stage2-example-toggle:focus-visible { outline: 2px solid var(--wizard-primary); outline-offset: 2px; }

    body.page-stage2 .stage-shell .stage2-custom-attribute-field .form-control {
        min-height: 48px;
        padding: .65rem .8rem;
        font-size: 16px;
        line-height: 1.4;
    }
    body.page-stage2 .stage-shell .stage2-custom-attribute-fields--grid { gap: .7rem; }
    body.page-stage2 .stage-shell .stage2-custom-attribute-field .form-label { margin-bottom: .3rem; }
    body.page-stage2 .stage-shell--photo-attributes .stage2-custom-character-layout { gap: 1rem; }
    body.page-stage2 .stage-shell--photo-attributes :is(.stage2-custom-card, .stage2-custom-hero) {
        padding: .35rem 0;
        border: 0;
        background: transparent;
        border-radius: 0;
        gap: .5rem;
    }
    body.page-stage2 .stage-shell--photo-attributes .stage2-attributes-style-row { gap: .35rem; margin-top: .6rem; }
    body.page-stage2 .stage-shell--photo-attributes .stage2-attributes-style-row .form-select { min-height: 44px; font-size: 16px; }
    body.page-stage2 .stage-shell--photo-attributes .custom-character-generation-panel--attributes { margin-top: .75rem; }
    body.page-stage2 .stage-shell--photo-attributes .custom-character-generate-button { min-height: 48px; }
    body.page-stage2 .stage-shell--photo-attributes .stage2-attributes-optional-instructions {
        padding: .4rem 0 0;
        border: 0;
        border-top: 1px solid var(--wizard-border);
        border-radius: 0;
        background: transparent;
    }
    body.page-stage2 .stage-shell--photo-attributes .stage2-attributes-optional-instructions summary { min-height: 44px; }
    body.page-stage2 .stage-shell .custom-character-variant-list {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        max-width: 100%;
        padding: .25rem;
        gap: .5rem;
        scroll-snap-type: x proximity;
        overscroll-behavior-x: contain;
    }
    body.page-stage2 .stage-shell .custom-character-variant-card { flex: 0 0 7rem; scroll-snap-align: start; }
    body.page-stage2 .stage-shell .custom-character-variant-card__selected { position: static; justify-self: center; }
    body.wizard-page .stage-shell .wizard-preview-collapse:not([hidden]) { min-height: 44px; }
    body.wizard-page .stage-shell .wizard-mobile-preview { margin-bottom: .75rem !important; }
    body.wizard-page .wizard-mobile-preview .wizard-preview-mode-frame { height: auto; }
}

/* Postać z atrybutami: podgląd spójny z etapem tekstów. */
body.page-stage2 .stage-shell--photo-attributes .stage2-custom-hero__title {
    font-size: 1.05rem;
}
body.page-stage2 .stage-shell--photo-attributes .wizard-project-preview-card {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}
@media (min-width: 1200px) {
    body.page-stage2 .stage-shell--photo-attributes #stage2Preview {
        width: auto;
        max-width: min(100%, 34rem);
        max-height: min(calc(100vh - 8.15rem), 820px);
        object-fit: contain;
    }
}

/* Czytelna informacja o dopłacie za personalizację we wszystkich kreatorach. */
body.wizard-page[class*="page-stage"]:not(.page-stage0) .stage-shell :is(.stage2-custom-chip, .attribute-custom-cost, .commission-charge, .commission-choice-price) {
    border: 2px solid var(--wizard-primary);
    background: rgba(var(--wizard-primary-rgb), .05);
    color: var(--wizard-primary-dark);
    width: fit-content;
    min-height: 0;
    padding: .15rem .4rem;
    font-size: .6875rem;
    font-weight: 600;
    line-height: 1.25;
    white-space: nowrap;
}

/* Mocniejszy kontur zachowuje przerywany styl pustych pól plików. */
body.wizard-page[class*="page-stage"] .stage-shell #customCharacterUploadPicker:not(.is-filled):not(.is-dragging),
body.wizard-page[class*="page-stage"] .stage-shell :is(.stage2-attributes-upload-row, .stage2-couple-upload-row, .stage2-couple-reference-card, .graphic-dropzone, .commission-dropzone):not(.is-filled):not(.is-dragging) {
    border-width: 2px;
    border-color: #248ca5;
}

body.page-stage2 .custom-character-panel--oto .stage2-custom-card:has(#customCharacterUploadPicker) {
    gap: .4rem;
}
body.page-stage2 .custom-character-panel--oto .stage2-custom-card__heading .wizard-section-title {
    margin-bottom: 0;
}
body.page-stage2 .custom-character-panel--oto #customCharacterUploadPicker {
    position: relative;
    margin-top: 0;
}

body.wizard-project-oto-on.page-stage2 .stage-shell:has(.stage2-photo-entry[data-photo-mode-trigger][aria-pressed="true"]) #mainCharacter {
    display: none !important;
}
body.wizard-project-oto-on.page-stage2 .stage-shell .person-category-strip {
    flex-wrap: nowrap;
    gap: .25rem;
    overflow-x: auto;
    padding-block: .125rem;
}
body.wizard-project-oto-on.page-stage2 .stage-shell .person-category-button {
    flex: 0 0 auto;
    padding-inline: .32rem;
    font-size: .7rem;
}
body.wizard-page.wizard-project-oto-on.page-stage2 .stage-shell .custom-character-panel--oto {
    padding: 0;
    border: 0;
    background: transparent !important;
}

body.wizard-project-oto-on.page-stage2 .custom-character-panel--oto .stage2-custom-character-layout {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: .65rem;
}
body.wizard-project-oto-on.page-stage2 .stage-shell .custom-character-panel--oto .stage2-custom-card {
    padding: 0;
    border: 0;
    background: transparent !important;
    box-shadow: none;
}
.stage2-oto-photo-heading {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: .4rem .6rem;
    margin-bottom: .4rem;
}

.stage2-oto-step {
    display: flex;
    align-items: center;
    gap: .45rem;
    margin: 0;
    color: var(--wizard-heading);
    font-size: .95rem;
    font-weight: 650;
}

body.wizard-project-oto-on.page-stage2 .stage2-oto-step .stage2-attributes-step-heading__badge {
    background: #bf2961;
    color: #fff;
    box-shadow: none;
}

.wizard-editor-help { margin-inline-start: auto; }

.wizard-editor-help > summary {
    display: flex;
    align-items: center;
    gap: .35rem;
    min-height: 44px;
    padding: .3rem .65rem;
    border: 1px solid var(--wizard-border);
    border-radius: 2rem;
    background: #fff;
    color: var(--wizard-accent-dark);
    font-size: .8rem;
    font-weight: 700;
    cursor: pointer;
    list-style: none;
    white-space: nowrap;
}
.wizard-editor-help > summary:hover { border-color: var(--wizard-accent); }
.wizard-editor-help > summary::-webkit-details-marker { display: none; }
.wizard-editor-help > summary svg {
    width: 1rem;
    height: 1rem;
    color: inherit;
}
.wizard-editor-help:not([open]) > .wizard-editor-help__content { display: none; }
.wizard-editor-help__content {
    position: absolute;
    z-index: 5;
    inset-inline-end: 0;
    inset-block-start: calc(100% + .25rem);
    display: grid;
    gap: .45rem;
    width: min(100%, 24rem);
    padding: .75rem;
    border: 1px solid #dce7ed;
    border-radius: .8rem;
    background: #fff;
    box-shadow: 0 8px 25px #18334722;
    color: #526778;
    font-size: .8rem;
}
.wizard-editor-help__content p { margin: 0; }
.wizard-editor-help__media {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .4rem;
    width: min(100%, 23rem);
    justify-self: center;
}
.wizard-editor-help__media figure {
    margin: 0;
    overflow: hidden;
    border: 1px solid #dce7ed;
    border-radius: .6rem;
    background: #fff;
    text-align: center;
}
.wizard-editor-help__media img {
    display: block;
    width: 100%;
    height: clamp(7rem, 31vw, 10rem);
    object-fit: contain;
}
.wizard-editor-help__media figcaption { padding: .2rem .35rem; font-weight: 600; }
body.wizard-project-oto-on.page-stage2 .custom-character-panel--oto #customCharacterUploadPicker.is-empty {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    justify-content: start;
    justify-items: stretch;
    min-height: 0;
    gap: .55rem;
    padding: 0;
    border: 0;
    background: transparent;
}
body.wizard-page .stage-shell .wizard-photo-hint {
    display: flex;
    align-items: center;
    gap: .55rem;
    max-width: 20rem;
    margin: 0;
    padding: .6rem .7rem;
    border-radius: 10px;
    background: #e8f7f8;
    color: #23495e;
    font-size: .8rem;
    line-height: 1.4;
}
body.wizard-page .stage-shell .wizard-photo-hint svg {
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    color: #087c90;
}
body.wizard-project-oto-on.page-stage2 #customCharacterUploadPicker.is-empty .stage2-upload-details {
    justify-self: start;
    padding: 0;
    border: 0;
    text-align: left;
}
body.wizard-project-oto-on.page-stage2 .custom-character-panel--oto .stage2-attributes-upload-actions .btn {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
}
body.wizard-project-oto-on.page-stage2 #customCharacterPhotoInput:focus-visible ~ #customCharacterUploadPicker #customCharacterUploadButton,
.wizard-editor-help > summary:focus-visible {
    outline: 2px solid #12637b;
    outline-offset: 2px;
}
body.wizard-project-oto-on.page-stage2 .custom-character-panel--oto .stage2-oto-outfit-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 28.5rem;
    gap: .45rem;
    margin: 0;
    padding: 0;
}

body.wizard-page.wizard-project-oto-on.page-stage2 .stage2-editor-column .wizard-stage-heading-line {
    position: relative;
    flex-wrap: nowrap;
    gap: .55rem;
    min-height: 44px;
    margin-bottom: .85rem !important;
}

body.wizard-page.wizard-project-oto-on.page-stage2 .stage2-editor-column .stage-form-actions {
    justify-content: space-between !important;
    margin: 1rem 0 0 !important;
}

body.wizard-page.wizard-project-oto-on.page-stage2 .stage2-photo-entry-row {
    gap: .5rem;
    max-width: 25rem;
    margin-inline: auto;
}

body.wizard-page.wizard-project-oto-on.page-stage2 .stage2-photo-entry {
    justify-content: center;
    gap: .4rem;
    min-height: 44px;
    padding: .2rem .45rem;
    border-radius: .65rem;
}

body.wizard-page.wizard-project-oto-on.page-stage2 .stage2-photo-entry[aria-pressed="true"] {
    border-color: #e994b4;
    background: #fff6fa;
    box-shadow: none;
}

body.wizard-page.wizard-project-oto-on.page-stage2 .stage2-photo-entry__icon {
    flex-basis: 2.1rem;
    width: 2.1rem;
    height: 2.1rem;
    padding: .18rem;
}
body.wizard-page.wizard-project-oto-on.page-stage2 .stage2-photo-entry__copy { flex: 0 1 auto; }
body.wizard-page.wizard-project-oto-on.page-stage2 .stage2-photo-entry__copy strong {
    color: var(--wizard-heading);
    font-size: .85rem;
}
body.wizard-page.wizard-project-oto-on.page-stage2 .stage2-photo-entry__arrow { display: none; }

body.wizard-project-oto-on.page-stage2 #customCharacterUploadPicker.is-filled {
    grid-template-columns: minmax(0, 1fr);
    width: fit-content;
    padding: 0;
    border: 0;
    background: transparent;
}

body.wizard-project-oto-on.page-stage2 #customCharacterUploadPicker .stage2-attributes-upload-file {
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
}

body.wizard-project-oto-on.page-stage2 #customCharacterUploadPicker.is-filled .stage2-attributes-upload-thumb {
    width: 72px;
    height: 72px;
    border-radius: .65rem;
    object-fit: cover;
}

.stage2-oto-upload-ready {
    position: absolute;
    inset: auto 4px 4px auto;
    display: grid;
    place-items: center;
    width: 18px;
    height: 18px;
    border: 1px solid #fff;
    border-radius: 50%;
    background: #17ae85;
    color: #fff;
    font-size: .7rem;
    line-height: 1;
}

body.wizard-project-oto-on.page-stage2 #customCharacterUploadPicker.is-filled .stage2-attributes-upload-actions {
    position: absolute;
    inset: 0;
}

body.wizard-page.wizard-project-oto-on.page-stage2 #customCharacterUploadPicker.is-filled #customCharacterUploadButton {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.stage2-oto-edit-icon { display: none; }
body.wizard-project-oto-on.page-stage2 #customCharacterUploadPicker.is-filled .stage2-oto-edit-icon {
    position: absolute;
    inset: 4px 4px auto auto;
    display: block;
    width: 25px;
    height: 25px;
    padding: 4px;
    border: 1px solid #dce6ee;
    border-radius: 7px;
    background: #fffffff0;
    color: #235270;
}

body.wizard-project-oto-on.page-stage2 #customCharacterUploadPicker.is-filled .stage2-oto-upload-icon,
body.wizard-project-oto-on.page-stage2 #customCharacterUploadPicker [data-upload-button-label] {
    display: none;
}

.stage2-oto-upload-icon {
    width: 1.85rem;
    height: 1.85rem;
}

body.wizard-project-oto-on.page-stage2 #customCharacterUploadPicker.is-empty .stage2-attributes-upload-actions {
    flex: 0 1 auto;
    width: auto;
}

body.wizard-page.wizard-project-oto-on.page-stage2 #customCharacterUploadPicker.is-empty #customCharacterUploadButton {
    justify-content: center;
    width: 72px;
    height: 72px;
    padding: 0;
    border: 1px dashed #ccd8e3 !important;
    border-radius: 10px;
    background: #fff !important;
    box-shadow: none !important;
    color: #73869a !important;
}

body.wizard-page.wizard-project-oto-on.page-stage2 #customCharacterUploadPicker.is-empty #customCharacterUploadButton:hover {
    border-color: var(--wizard-accent) !important;
}

body.page-stage2 .stage2-single-outfit-fields:has(> :is([data-professional-outfit-field], [data-halloween-style-field]):not(.d-none)),
body.page-stage2 .stage2-pair-outfit-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: end;
    gap: .45rem;
}

body.wizard-project-oto-on.page-stage2 .stage2-oto-outfit-fields > .stage2-single-outfit-fields {
    display: contents;
}

body.page-stage2 .stage2-pair-outfit-fields:not(:has(> :is([data-professional-outfit-field], [data-halloween-style-field]):not(.d-none))) > label {
    grid-column: 1 / -1;
}

body.page-stage2 .stage-shell--pair-attributes .stage2-pair-outfit-fields:has(> :is([data-professional-outfit-field], [data-halloween-style-field]):not(.d-none)) > label {
    grid-template-columns: minmax(0, 1fr);
}

body.page-stage2 .stage-shell--pair-attributes .stage2-pair-outfit-fields > label > span {
    justify-self: start;
    white-space: normal;
}

[data-professional-outfit-picker] .form-select {
    min-width: 0;
    text-overflow: ellipsis;
}

body.wizard-project-oto-on.page-stage2 .stage2-oto-outfit-fields:not(:has(:is([data-halloween-style-field], [data-professional-outfit-field]):not(.d-none))) label[for="outfitProfileKey"] {
    grid-column: 1 / -1;
    width: min(100%, 14rem);
}

body.wizard-page.wizard-project-oto-on.page-stage2 .stage-shell .stage2-oto-outfit-fields .form-select {
    width: 100%;
    min-width: 0;
    min-height: 40px;
    border: 1px solid #d8e1eb;
    border-radius: .8rem;
    background-color: #fff;
    font-size: .8rem;
    text-overflow: ellipsis;
}

@media (max-width: 479.98px) {
    body.wizard-page.wizard-project-oto-on.page-stage2 .stage-shell .stage2-oto-outfit-fields .form-select {
        min-height: 44px;
    }
}

.wizard-project-oto-on.page-stage2 .stage2-photo-options {
    display: grid;
    gap: .45rem;
}

body.wizard-page.wizard-project-oto-on.page-stage2 .stage-shell .stage2-instructions-disclosure > summary {
    justify-content: flex-start;
    min-height: 44px;
    padding: 0 .7rem;
    border: 0;
    border-radius: .5rem;
    background: #edf8fb;
    color: var(--wizard-heading);
    font-family: "Space Grotesk", sans-serif;
    font-size: .75rem;
}

body.wizard-project-oto-on.page-stage2 .stage2-instructions-disclosure summary::after { margin-left: auto; }

body.wizard-project-oto-on.page-stage2 .custom-character-panel--oto .custom-character-generation-panel {
    padding: 0;
}

body.wizard-project-oto-on.page-stage2 .custom-character-panel--oto .custom-character-generation-copy:not(:has(> :not(.d-none))) {
    display: none;
}

body.wizard-page.wizard-project-oto-on.page-stage2 .custom-character-generate-button { min-height: 44px; }

body.wizard-page.wizard-project-oto-on.page-stage2 .custom-character-panel--oto .wizard-section-title.wizard-numbered-section-title {
    font-weight: 650;
    text-transform: none;
}

body.wizard-page.wizard-project-oto-on.page-stage2 .wizard-project-preview-card {
    grid-template-rows: auto auto;
}

body.wizard-page.wizard-project-oto-on.page-stage2 .wizard-project-preview-card .wizard-preview-mode-frame,
body.wizard-page.wizard-project-oto-on.page-stage2 .wizard-mobile-preview--empty .wizard-mobile-preview-placeholder {
    display: grid;
    place-items: center;
    width: 100%;
    border: 1px solid #e5eaf0;
    border-radius: 1rem;
    background: #fff;
}

body.wizard-page.wizard-project-oto-on.page-stage2 .wizard-project-preview-card .wizard-preview-mode-frame {
    height: auto;
}

body.wizard-page.wizard-project-oto-on.page-stage2 .wizard-mobile-preview--empty .wizard-preview-mode-frame { display: none; }

body.wizard-page.wizard-project-oto-on.page-stage2 .wizard-project-preview-card #stage2Preview {
    justify-self: center;
    margin-inline: auto;
    border: 0;
    border-radius: inherit;
    box-shadow: none !important;
}

body.wizard-page.wizard-project-oto-on.page-stage2 .wizard-mobile-preview--empty .wizard-mobile-preview-placeholder {
    align-content: center;
    gap: .6rem;
    padding: 1rem;
    text-align: center;
}

body.wizard-page.wizard-project-oto-on.page-stage2 .stage-shell .wizard-character-preview-placeholder > .stage1-section-icon {
    --wizard-icon-size: 76px;
    padding: .9rem;
}

body.page-stage2 .stage2-preview-versions[hidden] { display: none; }
.stage-shell--attribute-texts .stage2-preview-with-variants > .attribute-texts-preview {
    flex: 1;
    min-width: 0;
}
body.page-stage2 .stage-shell--attribute-texts .stage2-preview-versions .attribute-custom-result {
    width: 100%;
}
@media (max-width: 991.98px) {
    body.page-stage2 .stage-shell--attribute-texts .stage2-preview-versions {
        margin-top: .65rem;
    }
    .stage-shell--attribute-texts .stage2-preview-versions .attribute-custom-variant-list {
        flex-wrap: nowrap;
        overflow-x: auto;
    }
    body.page-stage2 .stage-shell--attribute-texts .stage2-preview-versions .attribute-custom-result {
        flex: 0 0 5.5rem;
    }
}
body.page-stage2 .stage2-preview-versions {
    flex: 0 0 5.5rem;
    min-width: 0;
    gap: .4rem;
    margin: 0;
    padding: 0;
    border: 0;
}

body.page-stage2 .stage2-preview-versions .custom-character-variant-gallery__title { font-size: .78rem; }
body.page-stage2 .stage2-preview-versions .custom-character-variant-list {
    grid-template-columns: minmax(0, 1fr);
    padding: .2rem;
}
body.page-stage2 .stage2-preview-versions .custom-character-variant-card__image { height: 4.8rem; }
body.wizard-project-oto-on.page-stage2 .stage2-preview-versions .custom-character-variant-card.is-selected {
    border-color: #e4558b;
    background: #fff1f6;
    box-shadow: 0 0 0 2px #ff478c20;
}
body.wizard-project-oto-on.page-stage2 .stage2-preview-versions .custom-character-variant-card__selected { background: #b7426c; }

body.page-stage2 #previewContainer:has(> .stage2-preview-versions:not([hidden], .d-none)) {
    gap: .65rem;
}

body.wizard-project-oto-on.page-stage2 #previewContainer > .wizard-project-preview-card,
body.page-stage2 .stage-shell--photo-attributes #previewContainer > .wizard-project-preview-card { min-width: 0; }

@media (min-width: 992px) {
    body.page-stage2 .stage2-preview-with-variants:has(> .stage2-preview-versions:not([hidden], .d-none)) {
        display: flex;
        align-items: flex-start;
        gap: .65rem;
    }
    body.page-stage2 .stage2-preview-with-variants:has(> .stage2-preview-versions:not([hidden], .d-none)) > :first-child {
        min-width: 0;
        margin-inline: 0;
    }
    body.page-stage2 .stage2-preview-with-variants > .stage2-preview-versions {
        max-height: 65vh;
        overflow-y: auto;
    }

    body.wizard-page.wizard-project-oto-on.page-stage2 .stage-shell .row:has(> .stage2-editor-column) {
        --bs-gutter-x: 1.5rem;
        --oto-preview-column-width: min(44%, 35rem);
        /* Siatka zaczyna się wewnątrz kontenera, a kolumny ilustracji uwzględniają odstęp Bootstrapa. */
        --oto-editor-column-width: calc((100% + var(--bs-gutter-x)) * var(--wizard-character-editor-share) - var(--bs-gutter-x) - clamp(3rem, 5vw, 5rem));
        display: grid;
        grid-template-columns: minmax(0, var(--oto-editor-column-width)) minmax(0, var(--oto-preview-column-width));
        align-items: stretch !important;
        justify-content: start;
        gap: var(--bs-gutter-x);
        width: 100%;
        margin-inline: auto !important;
    }

    body.wizard-page.wizard-project-oto-on.page-stage2 .stage-shell .row:has(.stage2-preview-versions:not([hidden], .d-none)) {
        --oto-preview-column-width: min(48%, 41rem);
    }

    body.page-stage2 .stage2-preview-versions .custom-character-variant-list {
        max-height: min(66dvh, 690px);
        overflow-y: auto;
        scrollbar-width: thin;
    }

    body.wizard-page.wizard-project-oto-on.page-stage2 .stage-shell .stage2-editor-column,
    body.wizard-page.wizard-project-oto-on.page-stage2 .stage-shell #previewContainer:has(.wizard-project-preview-card[data-product]) {
        width: 100%;
        max-width: none;
        min-width: 0;
        margin-top: 0 !important;
        padding-inline: 0;
    }

    body.wizard-page.wizard-project-oto-on.page-stage2 .stage-shell .wizard-project-preview-card[data-product] {
        align-self: start;
        max-width: none;
    }

    body.wizard-page.wizard-project-oto-on.page-stage2 .stage-shell #previewContainer:has([data-mobile-character-preview]) {
        min-height: 0;
    }

    body.wizard-page.wizard-project-oto-on.page-stage2 .stage2-editor-column > .stage-form-card {
        height: 100%;
    }

    body.wizard-page.wizard-project-oto-on.page-stage2 .stage2-editor-column .stage-form-actions {
        margin-top: auto !important;
        padding-top: .9rem;
    }

    body.wizard-page.wizard-project-oto-on.page-stage2 .stage2-editor-column:has(.custom-character-panel--oto:not(.d-none)) {
        align-self: start;
    }

    body.wizard-page.wizard-project-oto-on.page-stage2 .stage-form-card:has(.custom-character-panel--oto:not(.d-none)) .stage-form-actions {
        margin-top: .75rem !important;
        padding-top: 0;
    }

    body.wizard-page.wizard-project-oto-on.page-stage2 .wizard-project-preview-card {
        --oto-preview-height: min(66vh, 690px);
        --oto-preview-height: min(66dvh, 690px);
    }

    body.wizard-page.wizard-project-oto-on.page-stage2 .wizard-project-preview-card .wizard-preview-mode-frame,
    body.wizard-page.wizard-project-oto-on.page-stage2 .wizard-mobile-preview--empty .wizard-mobile-preview-placeholder {
        min-height: var(--oto-preview-height);
    }

    body.wizard-page.wizard-project-oto-on.page-stage2 .wizard-project-preview-card #stage2Preview {
        max-height: calc(var(--oto-preview-height) - 2px);
    }
}

@media (max-width: 991.98px) {
    body.page-stage2 #previewContainer:has(> .stage2-preview-versions:not([hidden], .d-none)) {
        flex-direction: column;
        align-items: center !important;
    }

    body.page-stage2 .stage2-preview-versions {
        flex-basis: auto;
        width: min(100%, 34rem);
    }

    body.page-stage2 .stage2-preview-versions .custom-character-variant-list {
        display: flex;
        overflow-x: auto;
    }

    body.page-stage2 .stage2-preview-versions .custom-character-variant-card { flex: 0 0 5.5rem; }

    body.wizard-page.wizard-project-oto-on.page-stage2 .stage2-editor-column > .stage-form-card {
        padding: .8rem !important;
    }

    body.wizard-page.wizard-project-oto-on.page-stage2 .wizard-mobile-preview--empty .wizard-mobile-preview-placeholder {
        min-height: 130px;
    }
}

@media (min-width: 992px) {
    :is(body.page-stage3, body.wizard-project-attribute-texts) .attribute-custom-workflow {
        grid-template-columns: minmax(14.5rem, .65fr) minmax(0, 1.35fr);
    }
}
/* Kompaktowe podpowiedzi profilu i wspólny edytor własnego atrybutu. */
body.wizard-page .stage-shell .wizard-profile-notice {
    margin: .35rem 0 .6rem;
    color: #526778;
    font-size: .86rem;
    line-height: 1.4;
    font-weight: 400;
    flex-basis: 100%;
}
body.wizard-page .stage-shell .wizard-profile-notice strong { color: #247f92; font-weight: 600; }
body.wizard-page .stage-shell .attribute-stage-intro-row .attribute-edit-position { margin-left: auto; }
body.wizard-page .stage-shell .attribute-source-selector .attribute-source-choice {
    padding: .35rem .55rem;
    min-height: 48px;
    gap: .45rem;
}
body.wizard-page .stage-shell .attribute-source-selector .attribute-source-icon {
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    padding: 3px;
}
body.wizard-page .stage-shell .attribute-custom-workflow {
    grid-template-columns: minmax(0, 1fr);
    gap: .85rem;
}
@media (min-width: 992px) {
    body.wizard-page .stage-shell .attribute-custom-workflow {
        grid-template-columns: minmax(0, .65fr) minmax(0, 1.35fr);
    }
}
body.wizard-page .stage-shell .attribute-custom-workflow > *,
body.wizard-page .stage-shell .attribute-custom-intro .wizard-ai-intro__copy > * {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
}
body.wizard-page[class*="page-stage"] .stage-shell .attribute-custom-intro.wizard-ai-intro { grid-template-columns: minmax(0, 1fr); }
body.wizard-page[class*="page-stage"] .stage-shell .attribute-custom-intro .attribute-custom-cost {
    white-space: normal;
    max-width: 100%;
    line-height: 1.35;
}
body.wizard-page .stage-shell .attribute-custom-intro .attribute-custom-example { max-width: 16rem; }
@media (min-width: 992px) {
    body.wizard-page.wizard-project-oto-on.page-stage3 .stage-shell--oto-attributes .attribute-custom-workflow {
        grid-template-columns: minmax(0, 1fr);
    }
    body.wizard-page.wizard-project-oto-on.page-stage3 .stage-shell .attribute-description-field-heading > label {
        color: #526778;
        font-weight: 400;
    }
}

/* Mobilny START OTO korzysta z tych samych odstępów bocznych co START ilustracji. */
@media (max-width: 991.98px) {
    body.wizard-page.wizard-project-oto-on.page-stage0 .wizard-start--single-person > .container-xxl {
        padding-inline: 12px !important;
    }
    body.wizard-page.wizard-project-oto-on.page-stage0 .wizard-start--single-person > .container-xxl > .row {
        --bs-gutter-x: 0;
        margin-inline: 0;
    }
    body.wizard-page.wizard-project-oto-on.page-stage0 .wizard-start--single-person .wizard-start-card {
        padding: 0 !important;
        border: 0;
        background: transparent;
        box-shadow: none !important;
    }
    body.wizard-page.wizard-project-oto-on.page-stage0 .wizard-start--single-person .wizard-start-video-shell {
        width: 100%;
        max-width: none;
    }
}
/* START OTO: szersze, niezależne kolumny wyłącznie na desktopie. */
@media (min-width: 992px) {
    body.wizard-page.wizard-project-oto-on.page-stage0 .stage-shell > .container-xxl {
        width: 100%;
        max-width: 1248px;
    }
    body.wizard-page.wizard-project-oto-on.page-stage0 .stage-shell > .container-xxl > .row > .col-12 { width: 100%; }
    body.wizard-page.wizard-project-oto-on.page-stage0 .stage-shell .wizard-start-card {
        width: 100% !important;
        max-width: 1120px;
        margin-inline: auto;
        padding: clamp(1rem, 1.6vw, 1.5rem) !important;
    }
    body.wizard-page.wizard-project-oto-on.page-stage0 :is(.wizard-start-video-shell, .wizard-start-content) {
        width: 100%;
        max-width: none;
        min-width: 0;
        align-self: start;
        justify-self: stretch;
    }
    body.wizard-page.wizard-project-oto-on.page-stage0 .wizard-start-content {
        justify-items: stretch;
        align-content: start;
        gap: 12px;
    }
    body.wizard-page.wizard-project-oto-on.page-stage0 .stage-shell .wizard-start-copy {
        width: 100%;
        gap: 8px;
    }
    body.wizard-page.wizard-project-oto-on.page-stage0 .wizard-start-copy .wizard-stage-heading-line {
        justify-content: flex-start;
        align-items: flex-start;
        min-height: 0;
        margin: 0;
    }
    body.wizard-page.wizard-project-oto-on.page-stage0 .wizard-start-copy :is(.wizard-ui-icon, .stage1-section-icon) { display: inline-flex; flex-shrink: 0; }
    body.wizard-page.wizard-project-oto-on.page-stage0 .stage-shell .wizard-start-recipient-title { text-align: left; }
    body.wizard-page.wizard-project-oto-on.page-stage0 :is(.wizard-product-select-form, .wizard-start-inspirations, .wizard-start-profile-select) {
        width: 100%;
        min-width: 0;
        max-width: none;
        gap: 10px;
    }
    body.wizard-page.wizard-project-oto-on.page-stage0 .seasonal-start {
        width: 100%;
        max-width: none;
        margin: 0;
        padding-block: 8px;
    }
}


/* Lista profili nie zmienia wymiarów STARTU; wybór zastępuje opis w tym samym wierszu. */
body.wizard-page.wizard-stage-0 .stage-shell .wizard-start-profile-group.is-open {
    z-index: 30;
}

body.wizard-page.wizard-stage-0 .stage-shell .wizard-start-profile-picker__list {
    position: absolute;
    top: calc(100% + .3rem);
    inset-inline: 0;
    margin-top: 0;
    max-height: min(18rem, 45vh);
    overflow-y: auto;
    box-shadow: 0 1rem 2rem rgba(15, 23, 42, .16);
}

body.wizard-page.page-stage0 .wizard-start-inspirations .is-profile-panel-inline .wizard-start-profile-picker__list {
    position: static;
    margin-top: .3rem;
    box-shadow: none;
}

body.wizard-page.wizard-stage-0 .wizard-start-profile-group__body {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto minmax(1.3em, auto);
    font-size: .78rem;
}

body.wizard-page.wizard-stage-0 .wizard-start-profile-group__title {
    grid-row: 1;
}

body.wizard-page.wizard-stage-0 :is(.wizard-start-profile-group__description, .wizard-start-profile-group__selection) {
    grid-column: 1;
    grid-row: 2;
    min-width: 0;
    margin: 0;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.wizard-page.wizard-stage-0 .wizard-start-profile-group__body:has(.is-selected-profile) .wizard-start-profile-group__description {
    visibility: hidden;
}

body.wizard-page.wizard-stage-0 .wizard-start-profile-group__selection:not(.is-selected-profile) {
    display: none;
}

body.wizard-page.wizard-stage-0 .wizard-start-profile-group__selection.is-selected-profile {
    white-space: normal;
    overflow: visible;
}

@media (min-width: 992px) {
    body.wizard-page.wizard-stage-0 :is(.wizard-start-profile-group__title, .wizard-start-no-hints__title, .wizard-start-profile-group__selection.is-selected-profile) {
        font-weight: 700;
    }
}

/* Zwarte pola referencji bez pustego wiersza nazwy pliku. */
body.wizard-page .stage-shell .attribute-reference-row {
    flex-wrap: wrap;
    gap: .4rem;
    padding: .4rem .5rem;
    min-height: 48px;
}
body.wizard-page .stage-shell .attribute-reference-row:has([data-has-file="false"]) {
    border-style: dashed;
    border-color: var(--wizard-accent);
    justify-content: center;
}
body.wizard-page .stage-shell .attribute-reference-row .attribute-reference-upload-icon {
    width: 26px;
    height: 26px;
    flex: 0 0 26px;
    color: var(--wizard-accent);
    order: -2;
}
body.wizard-page .stage-shell .attribute-reference-row .custom-upload-file-name[data-has-file="false"],
body.wizard-page .stage-shell .attribute-reference-row:has([data-has-file="true"]) :is(.attribute-reference-upload-icon, .attribute-reference-formats),
body.wizard-page .stage-shell .attribute-custom-reference .form-text:empty { display: none; }
body.wizard-page .stage-shell .attribute-reference-formats {
    color: #718090;
    font-size: .72rem;
    line-height: 1.35;
    flex: 0 1 auto;
}
body.wizard-page .stage-shell .attribute-reference-row .btn { min-height: 36px; display: inline-flex; align-items: center; }
body.wizard-page .stage-shell .attribute-custom-reference { padding-block: .4rem; }
body.wizard-page .stage-shell .attribute-custom-reference > summary { margin-bottom: .35rem; }
body.wizard-page .stage-shell .attribute-custom-form { gap: .4rem; }

.wizard-start-local-video { overflow: hidden; background: #fff; }
.wizard-start-local-video video { object-fit: contain; }
.wizard-start-local-video .wizard-start-video-play {
    display: grid;
    place-items: center;
    border: 0;
    background: transparent;
    cursor: pointer;
}
.wizard-start-local-video .wizard-start-video-play[hidden] { display: none; }
.wizard-start-video-play span {
    display: grid;
    place-items: center;
    width: clamp(3.5rem, 7vw, 4.5rem);
    aspect-ratio: 1;
    border: 3px solid #fff;
    border-radius: 50%;
    background: #e45f91;
    color: #fff;
    box-shadow: 0 .3rem 1.2rem #0003;
}
.wizard-start-video-play svg { width: 50%; height: 50%; fill: currentColor; }
.wizard-start-video-play:hover span { background: #cf467b; }
.wizard-start-video-play:focus-visible { outline: 3px solid #119abb; outline-offset: -5px; }
@media (max-width: 575.98px) {
    body.wizard-page .stage-shell .attribute-reference-row .btn { min-height: 44px; }
    body.wizard-page .stage-shell .attribute-reference-row:has([data-has-file="true"]) .custom-upload-file-name { flex-basis: calc(100% - 52px); }
}
/* Dodatkowa kompaktyzacja desktopowego kreatora OTO. */
@media (min-width: 992px) {
    body.wizard-page.wizard-project-oto-on.page-stage2 .stage-form-card {
        padding: .85rem 1rem !important;
    }
    body.wizard-page.wizard-project-oto-on.page-stage2 .wizard-stage-heading-line {
        margin-bottom: .65rem !important;
        row-gap: .35rem;
    }
    body.wizard-page.wizard-project-oto-on.page-stage2 .custom-character-panel--oto {
        margin-top: .4rem !important;
    }
    body.wizard-page.wizard-project-oto-on.page-stage2 .custom-character-panel--oto :is(.wizard-section-title, .stage2-custom-step-title--optional) {
        font-size: .8rem;
        line-height: 1.3;
    }
    body.wizard-page.wizard-project-oto-on.page-stage2 .stage-form-actions {
        margin-top: .75rem !important;
    }
    body.wizard-page.wizard-project-oto-on.page-stage2 #mainCharacter.asset-grid-scroll--tall {
        max-height: min(27vh, 260px);
    }
    body.wizard-page.wizard-project-oto-on.page-stage2 #colorsSection {
        margin-bottom: .4rem !important;
    }
    body.wizard-page.wizard-project-oto-on.page-stage3 .stage-shell .attribute-tag-search-group :is(.attribute-tag-filter, .attribute-search-submit) {
        min-height: 32px;
        padding-block: .2rem;
        font-size: .8rem;
        line-height: 1.25;
    }
}

/* START: równe, czytelne produkty pod danymi odbiorcy. */
body.wizard-page.wizard-stage-0 .wizard-product-tile-grid {
    width: 100%;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-auto-rows: 1fr;
    gap: 6px;
}
body.wizard-page.wizard-stage-0 .wizard-product-tile {
    grid-template-columns: 28px minmax(0, 1fr);
    grid-template-rows: auto;
    align-items: center;
    gap: 6px;
    min-height: 48px;
    padding: 6px;
    border-width: 1px;
    box-shadow: none;
}
body.wizard-page.wizard-stage-0 .wizard-product-tile:has(.wizard-product-tile__input:checked) {
    border-width: 1px;
    box-shadow: inset 0 0 0 1px var(--wizard-primary);
}
body.wizard-page.wizard-stage-0 .wizard-product-tile__media,
body.wizard-page.wizard-stage-0 .wizard-product-tile__media img {
    width: 28px;
    height: 28px;
    min-height: 28px;
    max-width: 28px;
    max-height: 28px;
}
body.wizard-page.wizard-stage-0 .wizard-product-tile__label {
    min-height: 0;
    font-size: .65rem;
    line-height: 1.25;
    text-align: left;
}
@media (min-width: 992px) {
    body.wizard-page.wizard-stage-0:not(.wizard-project-oto-on) .wizard-start-layout .wizard-start-video-shell { align-self: center; }
}
@media (max-width: 575.98px) {
    body.wizard-page.wizard-stage-0 .wizard-product-tile-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Uchwyt jest widoczny również w przeglądarkach z przewijaniem nakładkowym. */
.wizard-text-suggestions__header { border-radius: .7rem .7rem 0 0; }
.wizard-inspiration-scroll { position: relative; min-width: 0; }
.wizard-page .wizard-inspiration-scroll > .wizard-inspiration-scroll__list {
    max-height: var(--inspiration-list-height, min(16rem, 40svh));
    overflow-y: auto;
    overscroll-behavior-y: contain;
    scrollbar-width: none;
}
.wizard-inspiration-scroll__list::-webkit-scrollbar { display: none; }
.wizard-page .wizard-inspiration-scroll:has(> .wizard-inspiration-scroll__track:not([hidden])) > .wizard-inspiration-scroll__list {
    padding-inline-end: 20px;
}
.wizard-inspiration-scroll__track {
    position: absolute;
    inset-block: 3px;
    inset-inline-end: 3px;
    width: 14px;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: #f4e5ec;
    cursor: ns-resize;
    touch-action: none;
}
.wizard-inspiration-scroll__track > span {
    position: absolute;
    inset-block-start: 0;
    inset-inline: 2px;
    border-radius: 8px;
    background: #a34b70;
}

@media (min-width: 768px) {
    .wizard-inspiration-scroll--mobile { display: contents; }
}

@media (max-width: 767.98px) {
    body.wizard-project-oto-on.page-stage2 .stage2-photo-entry-row:has(> .stage2-photo-entry:nth-child(2)) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .4rem;
    }
    body.wizard-project-oto-on.page-stage2 #mainCharacter {
        --inspiration-list-height: 15rem;
    }
    body.wizard-page.wizard-project-oto-on.page-stage3 .stage-shell--oto-attributes .wizard-inspiration-scroll--mobile {
        --inspiration-list-height: 8rem;
    }
    body.wizard-page.wizard-project-oto-on.page-stage3 .stage-shell--oto-attributes .wizard-inspiration-scroll--mobile:has(> .attribute-category-strip) {
        --inspiration-list-height: 4.9rem;
        order: 2;
    }
    body.wizard-page.wizard-project-oto-on.page-stage3 .stage-shell--oto-attributes .wizard-inspiration-scroll--mobile:has(> .asset-grid-scroll) {
        --inspiration-list-height: 14rem;
        order: 3;
    }
    body.wizard-page.wizard-project-oto-on:is(.page-stage2, .page-stage3) .stage-shell .wizard-inspiration-scroll--mobile > .wizard-inspiration-scroll__list {
        max-height: var(--inspiration-list-height) !important;
        overflow: auto !important;
        overscroll-behavior-y: contain;
    }
    body.wizard-page.wizard-project-oto-on:is(.page-stage2, .page-stage3) .stage-shell .wizard-inspiration-scroll:has(> .wizard-inspiration-scroll__track:not([hidden])) > .wizard-inspiration-scroll__list {
        padding-inline-end: 24px !important;
    }
    body.wizard-project-oto-on:is(.page-stage2, .page-stage3) .stage-shell .wizard-inspiration-scroll__track {
        width: 18px;
        z-index: 6;
    }
}

/* Prawa karta START w kreatorach jednej osoby. */
.wizard-start--single-person .wizard-start-profile-scrollbar { display: none; }
body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-content {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    align-self: stretch;
    width: 100%;
    min-width: 0;
    max-width: none;
    gap: .75rem;
    padding: 1rem;
    border: 1px solid #e5eaf0;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 10px 28px #172e4710;
}

body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-copy {
    display: grid;
    gap: .45rem;
}

body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-copy .wizard-stage-heading-line {
    align-items: center;
    justify-content: flex-start;
    margin: 0 !important;
}

body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-recipient-intro {
    color: #506176;
    font-size: .92rem;
    font-weight: 400;
    line-height: 1.45;
}

body.wizard-page.page-stage0 .wizard-start--single-person .wizard-product-select-form {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    align-self: stretch;
    width: 100%;
    min-width: 0;
    min-height: 0;
    max-width: none;
    height: auto;
    gap: .75rem;
    margin-top: 0;
    padding-top: 0;
}

body.wizard-page.page-stage0 .wizard-start--single-person :is(.wizard-start-inspirations, .wizard-start-profile-select) {
    width: 100%;
    min-width: 0;
    max-width: none;
    gap: .75rem;
}

body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-profile-group-grid {
    grid-template-columns: minmax(0, 1fr);
}

body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-profile-picker__button {
    min-height: 5rem;
    gap: .85rem;
    padding: .6rem 1rem;
}

body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-profile-group .wizard-start-profile-group__icon {
    width: 2.65rem;
    height: 2.65rem;
    border-radius: .85rem;
    background: #e8f7f9;
    color: #007d92;
}

.wizard-start--single-person .wizard-start-profile-group__selection:not(.is-selected-profile),
.wizard-start--single-person .wizard-start-profile-group__body:has(.is-selected-profile) .wizard-start-profile-group__description {
    display: none;
}

body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-profile-picker__list {
    width: 100%;
    max-height: min(17rem, 48vh);
    max-height: min(17rem, 48dvh);
    overflow: hidden auto;
    overscroll-behavior: contain;
    align-content: start;
}

body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-profile-category__heading {
    background: #fff0f5;
    color: #8d3454;
}

body.wizard-page.wizard-stage-0 .stage-shell .wizard-start-profile-picker__option.is-selected,
body.wizard-page.wizard-stage-0 .stage-shell .wizard-start-profile-picker__button:has(.is-selected-profile),
body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-profile-picker__button:is(:hover, [aria-expanded="true"]) {
    background: #fff0f5;
    border-color: #e8b9ca;
}

body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-no-hints {
    justify-self: start;
    width: fit-content;
    max-width: 100%;
}

body.wizard-page.page-stage0 .stage-shell.wizard-start--single-person .wizard-start-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
    align-items: stretch;
    gap: .6rem !important;
    margin-top: .25rem !important;
    padding-top: 0;
}

body.wizard-page.page-stage0 .stage-shell.wizard-start--single-person .wizard-start-actions .btn {
    align-self: stretch !important;
    min-width: 0 !important;
    width: 100% !important;
    min-height: 3.1rem !important;
    margin: 0 !important;
    padding: .55rem .4rem !important;
    white-space: normal;
}

body.wizard-page.page-stage0 .stage-shell.wizard-start--single-person .wizard-start-actions .wizard-back-btn {
    order: 0 !important;
    grid-column: 1;
    grid-row: 1;
    font-size: .76rem !important;
    font-weight: 600;
}

body.wizard-page.page-stage0 .stage-shell.wizard-start--single-person .wizard-start-actions .wizard-submit-btn {
    order: 1 !important;
    grid-column: 2;
    grid-row: 1;
}

@media (min-width: 992px) {
    body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-card {
        max-width: 1200px;
        margin-inline: auto;
    }

    body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-layout {
        grid-template-columns: minmax(0, 1fr) minmax(0, min(25rem, calc(42% - .42rem)));
        align-items: stretch;
        gap: 1rem;
    }

    body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-content {
        grid-area: 1 / 2;
    }

    body.wizard-page.wizard-project-oto-on.page-stage0 .wizard-start--single-person .wizard-start-layout {
        grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
        gap: clamp(1rem, 2vw, 1.75rem);
    }

    body.wizard-page.page-stage0 :where(.stage-shell:not(.wizard-start--single-person)) .wizard-start-inspirations .wizard-start-profile-picker__list {
        width: 88%;
        inset-inline-end: auto;
    }

    body.wizard-page.page-stage0 .stage-shell.wizard-start--single-person .wizard-start-actions {
        margin-top: auto !important;
        padding-top: .6rem;
    }
}

@media (max-width: 991.98px) {
    body.wizard-page.page-stage0 .wizard-start--single-person.ai-illustration-start--person .wizard-start-content {
        padding: 0;
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-profile-picker__list {
        padding-inline-end: 1.45rem;
        scrollbar-width: none;
    }

    body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-profile-scrollbar:not([hidden]) {
        position: absolute;
        z-index: 21;
        inset-inline-end: 5px;
        top: calc(100% + .3rem + 5px);
        display: block;
        width: 14px;
        overflow: hidden;
        border-radius: 8px;
        background: #f1f5f9;
        pointer-events: none;
    }
    body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-profile-scrollbar > span {
        display: block;
        margin-inline: 2px;
        border-radius: 8px;
        background: #aeb9c3;
    }

    body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-profile-picker__button {
        min-height: 3.55rem;
        gap: .7rem;
        padding: .45rem .7rem;
    }

    body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-profile-group .wizard-start-profile-group__icon {
        width: 2.4rem;
        height: 2.4rem;
        border-radius: .75rem;
        box-shadow: none;
    }

    body.wizard-page.page-stage0 .wizard-start--single-person .wizard-start-profile-picker__option {
        min-height: 44px;
    }
}

/* Wspólny edytor opisu atrybutu i inspiracji. */
body.wizard-page .stage-shell .attribute-description-slot > .attribute-description-editor.attribute-description-layout {
    grid-template-columns: minmax(0, 1.18fr) minmax(0, .92fr);
    align-items: start;
    gap: .4rem .75rem;
    margin-top: .75rem !important;
    padding-top: .6rem;
    border-top: 1px solid #e2e8ec;
}
.attribute-description-editor > .attribute-description-heading,
.attribute-description-editor:not(:has(> .attribute-suggestion-block:not(.d-none))) > .attribute-description-fields {
    grid-column: 1 / -1;
}
@media (min-width: 992px) {
    .stage-shell--oto-attributes .attribute-description-slot--normal > .attribute-description-editor:has(> .attribute-suggestion-block:not(.d-none)) {
        grid-template-rows: auto 1fr;
    }

    .stage-shell--oto-attributes .attribute-description-slot--normal > .attribute-description-editor:has(> .attribute-suggestion-block:not(.d-none)) > .attribute-description-heading {
        grid-column: 1;
    }

    .stage-shell--oto-attributes .attribute-description-slot--normal > .attribute-description-editor > .attribute-suggestion-block {
        grid-column: 2;
        grid-row: 1 / span 2;
    }
}
.attribute-description-heading h2 {
    margin: 0;
    font-size: .95rem;
    font-weight: 750;
}
.stage-shell--oto-attributes .oto-attribute-section-title {
    display: flex;
    align-items: center;
    gap: .4rem;
    margin: 0;
    font-size: 1.05rem;
    font-weight: 750;
}
.stage-shell--oto-attributes .attribute-library > .oto-attribute-section-title { margin-bottom: .45rem; }
body.wizard-page .stage-shell .attribute-description-editor .attribute-description-fields {
    min-width: 0;
    gap: 0;
}
body.wizard-page .stage-shell .attribute-description-editor .attribute-description-field-heading {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0 .5rem;
    margin: 0;
    font-size: .8rem;
    font-weight: 700;
    text-transform: none;
}
.attribute-description-field-heading > .wizard-text-size {
    position: static;
    inline-size: 7rem;
    min-height: 32px;
}
.attribute-description-field-heading > .wizard-text-size button { min-height: 30px; }
@media (max-width: 575.98px) {
    .attribute-description-field-heading > .wizard-text-size,
    .attribute-description-field-heading > .wizard-text-size button { min-height: 44px; }
    .oto-custom-attribute-active .attribute-description-slot--custom .attribute-description-editor .attribute-description-field-heading { grid-column: 1 / -1; }
}
.attribute-description-field-heading > .wizard-text-color {
    min-width: 0;
    max-width: 100%;
    margin: 0 0 0 auto;
    font-weight: 400;
}
body.wizard-page .stage-shell--oto-attributes .attribute-description-editor .attribute-description-field-heading {
    justify-content: flex-end;
}
.attribute-description-field-heading .wizard-text-color > summary {
    min-height: 32px;
    color: #526474;
    white-space: nowrap;
}
body.wizard-page .stage-shell .attribute-description-editor .attribute-description-input:not(.is-invalid) {
    border-color: #d5dee5;
    background: #fff;
}
body.wizard-page .stage-shell .attribute-description-editor .attribute-description-input:not(.is-invalid):focus {
    border-color: #479d9c !important;
    box-shadow: 0 0 0 .14rem #479d9c25;
}

body.wizard-page .stage-shell .attribute-description-editor > .attribute-suggestion-block {
    align-self: start;
    min-width: 0;
    margin: 0 !important;
    padding: .45rem;
    border: 1px solid #d5ebe9;
    border-radius: .75rem;
    background: #f0faf9;
    box-shadow: none;
}
body.wizard-page .stage-shell .attribute-description-editor .attribute-suggestion-header {
    margin: 0 0 .35rem !important;
}
body.wizard-page .stage-shell .attribute-description-editor .attribute-suggestion-heading {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    min-height: 0;
    padding: 0 .15rem;
    border: 0;
    background: transparent;
    color: #245d61 !important;
    font-size: .8rem;
    font-weight: 750;
    text-transform: none;
    box-shadow: none;
}
body.wizard-page .stage-shell .attribute-description-editor .attribute-suggestion-heading > .stage1-section-icon {
    flex: 0 0 1rem;
    width: 1rem;
    height: 1rem;
    min-width: 0;
    min-height: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
}
body.wizard-page .stage-shell .attribute-description-editor .attribute-suggestion-list {
    max-height: none;
    gap: .25rem;
    overflow: visible;
    border: 0;
}
body.wizard-page .stage-shell .attribute-description-editor .attribute-suggestion-list .list-group-item-action {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .4rem;
    min-height: 2rem;
    margin: 0;
    padding: .35rem .5rem;
    border: 1px solid #dce8e8;
    border-radius: .4rem;
    background: #fff;
    color: #294150;
    font-size: .78rem;
    line-height: 1.3;
    text-align: left;
    overflow-wrap: anywhere;
    box-shadow: none;
}
body.wizard-page .stage-shell .attribute-description-editor .attribute-suggestion-list .list-group-item-action::after {
    content: '';
    flex: 0 0 .38rem;
    height: .38rem;
    margin-inline-end: .15rem;
    border: solid #4d8183;
    border-width: 1px 1px 0 0;
    transform: rotate(45deg);
}
body.wizard-page .stage-shell .attribute-description-editor .attribute-suggestion-list .list-group-item-action:focus-visible {
    outline: 2px solid #479d9c;
    outline-offset: -2px;
}
body.wizard-page .stage-shell .attribute-description-editor .attribute-suggestion-list .list-group-item-action.is-selected {
    border-color: #99cdca;
    background: #e0f3f1;
    color: #245d61;
    box-shadow: none;
}
body.wizard-page .stage-shell .attribute-description-editor .attribute-suggestion-list .list-group-item-action.is-selected::after {
    content: '✓';
    flex: 0 0 auto;
    height: auto;
    border: 0;
    color: #245d61;
    font-size: .85rem;
    transform: none;
}
body.wizard-page.page-stage3 .stage-shell .attribute-category-strip { scrollbar-color: #aab6be transparent; }

/* Równy odstęp nad wyszukiwarką i nad kategoriami. */
body.page-stage3 #optionForm :is(.attribute-selector, .attribute-library > .attribute-tag-search) {
    margin-bottom: .875rem !important;
}
body.page-stage3 #optionForm .attribute-tag-search-group {
    margin-bottom: 0;
}
body.page-stage3 #optionForm .attribute-category-strip {
    padding-block-start: 0;
}

@media (hover: hover) {
    body.wizard-page .stage-shell .attribute-description-editor .attribute-suggestion-list .list-group-item-action:not(.is-selected):hover {
        border-color: #add4d1;
        background: #f5fbfa;
    }
}
@media (max-width: 767.98px) {
    body.wizard-page .stage-shell .attribute-description-slot > .attribute-description-editor.attribute-description-layout { grid-template-columns: minmax(0, 1fr); }
    .attribute-description-field-heading .wizard-text-color > summary { min-height: 44px; }
    body.wizard-page .stage-shell .attribute-description-editor .attribute-suggestion-list .list-group-item-action { min-height: 44px; }
}

.stage-shell--oto-attributes .oto-attribute-color-label-short,
.stage-shell--oto-attributes:not(.oto-custom-attribute-active) .attribute-custom-help {
    display: none;
}
body.wizard-project-oto-on.page-stage3 .stage-shell.oto-custom-attribute-active .attribute-stage-heading {
    position: relative;
    gap: .45rem;
    padding-right: 0;
}
.oto-custom-attribute-active .attribute-custom-help > summary { border-radius: .55rem; }
.oto-custom-attribute-active .wizard-profile-notice { display: none; }
.oto-custom-attribute-active .attribute-stage-intro-row:not(:focus-within) {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
}
.oto-custom-attribute-active #attributeCountSelector {
    position: static;
    margin-top: .3rem !important;
}
body.wizard-page .stage-shell.oto-custom-attribute-active .custom-attribute-panel { background: transparent !important; }
body.wizard-page .stage-shell.oto-custom-attribute-active .attribute-custom-workflow {
    gap: .4rem;
}
.oto-custom-attribute-active .attribute-custom-workflow > .attribute-source-back {
    justify-self: start;
    align-items: center;
    min-height: 32px;
    padding: .2rem 0;
    color: var(--wizard-accent-dark);
    font-size: .85rem;
    text-decoration: none;
}
.oto-custom-attribute-active .attribute-custom-workflow > .attribute-source-back:hover { text-decoration: underline; }
.oto-custom-attribute-active .attribute-custom-form {
    padding: .75rem;
    border: 1px solid var(--wizard-border);
    border-radius: .8rem;
    background: #f5f8fa;
}
body.page-stage3 .oto-custom-attribute-active .attribute-custom-form > :is(.attribute-custom-prompt, .attribute-custom-reference) {
    padding: 0;
    background: transparent;
}
.oto-custom-attribute-active .attribute-custom-prompt-heading {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: .2rem .6rem;
    margin-bottom: .35rem;
}
.oto-custom-attribute-active .attribute-custom-prompt-heading label {
    font-size: .875rem;
    font-weight: 700;
}
.oto-custom-attribute-active .attribute-custom-surcharge { color: #526778; font-size: .75rem; }
.oto-custom-attribute-active .attribute-prompt-count {
    margin-bottom: -.2rem;
    line-height: 1.15;
}
body.wizard-project-oto-on.page-stage3 .stage-shell.oto-custom-attribute-active .attribute-custom-reference summary {
    display: flex;
    align-items: center;
    gap: .3rem;
    min-height: 38px;
    margin-bottom: 0;
    color: var(--wizard-accent-dark);
    font-weight: 700;
}
.oto-custom-attribute-active .attribute-custom-reference[open] summary { margin-bottom: .3rem !important; }
body.page-stage3 .oto-custom-attribute-active .attribute-custom-form .custom-attribute-ai-panel { padding: 0; }
body.page-stage3 .oto-custom-attribute-active .attribute-custom-form .custom-attribute-ai-generate {
    width: 100%;
    border-color: #08798b;
    border-radius: .55rem;
    background: #08798b;
    color: #fff;
    box-shadow: none;
    text-transform: none;
}
body.page-stage3 .oto-custom-attribute-active .attribute-custom-form .custom-attribute-ai-generate:hover:not(:disabled) {
    border-color: #096677;
    background: #096677;
}
.oto-custom-attribute-active .attribute-description-slot--custom {
    padding-top: .45rem;
    border-top: 1px solid var(--wizard-border);
}
body.wizard-page.page-stage3 .stage-shell.oto-custom-attribute-active .attribute-description-slot--custom > .attribute-description-editor {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: .3rem .5rem;
    margin: 0 !important;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}
.oto-custom-attribute-active .attribute-description-slot--custom .attribute-description-heading { grid-column: 1; }
.oto-custom-attribute-active .attribute-description-slot--custom .oto-attribute-section-title { font-size: .9rem; }
body.wizard-page .stage-shell.oto-custom-attribute-active .attribute-description-slot--custom .stage1-section-icon { display: none; }
body.wizard-page .stage-shell.oto-custom-attribute-active .attribute-description-slot--custom .attribute-description-fields { display: contents; }
.oto-custom-attribute-active .attribute-description-slot--custom .attribute-description-field-heading { grid-column: 2; }
.oto-custom-attribute-active .attribute-description-slot--custom .attribute-description-field-heading > label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}
.oto-custom-attribute-active .attribute-description-slot--custom .attribute-description-control { grid-column: 1 / -1; }
.oto-custom-attribute-active .attribute-description-slot--custom .attribute-hide-arrows { display: none !important; }
.oto-custom-attribute-active .attribute-description-slot--custom .oto-attribute-color-label { display: none; }
.oto-custom-attribute-active .attribute-description-slot--custom .oto-attribute-color-label-short { display: inline; }
.oto-custom-attribute-active .attribute-description-slot--custom .wizard-text-color > summary {
    padding-inline: .55rem;
    border: 1px solid var(--wizard-border);
    border-radius: .5rem;
    background: #fff;
}
body.wizard-page.wizard-project-oto-on.page-stage3 .stage-shell.oto-custom-attribute-active .attribute-custom-form .attribute-description-input {
    min-height: calc(3lh + 1rem + 2px) !important;
    height: auto;
    overflow-y: auto;
}
.oto-custom-attribute-active .stage3-editor-actions { justify-content: space-between !important; }

@media (min-width: 992px) {
    .oto-custom-attribute-active .attribute-custom-help > summary { min-height: 34px; }
    body.page-stage3 .oto-custom-attribute-active .attribute-custom-form {
        grid-template-columns: minmax(0, 1fr) minmax(9rem, .65fr);
    }
    .oto-custom-attribute-active .attribute-custom-form > :not(.attribute-custom-reference, .custom-attribute-ai-panel),
    .oto-custom-attribute-active .attribute-custom-form:has(.attribute-custom-reference[open]) > * {
        grid-column: 1 / -1;
    }
}
@media (max-width: 991.98px) {
    .oto-custom-attribute-active .oto-attribute-title-suffix { display: none; }
    body.wizard-page.page-stage3 .stage-shell.oto-custom-attribute-active #attributeSelector {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        margin-bottom: .3rem !important;
    }
    body.wizard-page.page-stage3 .stage-shell.oto-custom-attribute-active #attributeSelector[data-attribute-count="4"] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    body.wizard-page.page-stage3 .stage-shell.oto-custom-attribute-active #attributeSelector .btn { min-height: 44px !important; }
    .oto-custom-attribute-active .attribute-custom-workflow > .attribute-source-back,
    body.wizard-project-oto-on.page-stage3 .stage-shell.oto-custom-attribute-active .attribute-custom-reference summary,
    body.wizard-page .stage-shell.oto-custom-attribute-active .attribute-custom-form .custom-attribute-ai-generate,
    .oto-custom-attribute-active .attribute-custom-form .attribute-reference-row .btn,
    .oto-custom-attribute-active .attribute-description-slot--custom .wizard-text-color > summary { min-height: 44px; }
    body.wizard-project-oto-on.page-stage3 .stage-shell.oto-custom-attribute-active .attribute-custom-form :is(.attribute-custom-instructions, .attribute-description-input) { font-size: 16px; }
    .oto-custom-attribute-active .stage3-editor-actions {
        flex-direction: row;
        align-items: center;
    }
    body.wizard-page.page-stage3 .stage-shell.oto-custom-attribute-active .stage3-editor-actions .wizard-submit-btn {
        flex: 1;
        width: auto !important;
    }
    body.wizard-page .stage-shell.oto-custom-attribute-active .wizard-mobile-preview--collapsed {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: .4rem;
    }
    body.wizard-page .stage-shell.oto-custom-attribute-active .wizard-mobile-preview--collapsed .wizard-preview-mode,
    body.wizard-page .stage-shell.oto-custom-attribute-active .wizard-mobile-preview--collapsed > :not(.wizard-project-preview-heading, .wizard-preview-collapse) {
        display: none !important;
    }
    body.wizard-page .stage-shell.oto-custom-attribute-active .wizard-preview-collapse:not([hidden]) {
        display: block;
        min-height: 44px;
        flex-shrink: 0;
        margin: 0 0 0 auto;
        padding: .35rem .65rem;
        border: 1px solid var(--wizard-border);
        border-radius: .5rem;
        background: #fff;
        color: var(--wizard-accent-dark);
        font-size: .8rem;
        font-weight: 700;
    }
    .oto-custom-attribute-active .wizard-mobile-preview:not(.wizard-mobile-preview--collapsed) .wizard-preview-collapse { margin-top: .35rem; }
}
