.auth-layout { display: grid; min-height: 100vh; min-height: 100dvh; place-items: center; padding: calc(var(--safe-top) + 24px) 16px calc(var(--safe-bottom) + 24px); }
.auth-card { width: min(100%, 480px); padding: clamp(22px, 7vw, 38px); }
.auth-brand { width: 146px; margin-bottom: 32px; }
.auth-form { display: grid; gap: 15px; margin-top: 24px; }
.auth-switch { display: flex; gap: 8px; padding: 5px; border-radius: var(--radius-pill); background: var(--sand-soft); }
.auth-switch button { flex: 1; border: 0; border-radius: var(--radius-pill); padding: 9px; background: transparent; font-weight: 700; cursor: pointer; }
.auth-switch button[aria-selected="true"] { background: var(--white); box-shadow: 0 3px 10px rgb(81 48 57 / 0.08); }
.quiet-link { width: fit-content; padding: 2px 0; border: 0; background: transparent; color: var(--wine); font: inherit; font-size: 0.9rem; font-weight: 700; text-decoration: underline; text-decoration-color: rgb(123 63 92 / 0.35); text-underline-offset: 3px; cursor: pointer; }
.quiet-link:focus-visible { outline: 3px solid rgb(123 63 92 / 0.22); outline-offset: 4px; border-radius: 4px; }
.auth-forgot { margin-top: -7px; }
.auth-help { display: flex; justify-content: center; margin-top: 24px; padding-top: 18px; border-top: 1px solid rgb(123 63 92 / 0.11); }
.auth-help .quiet-link { color: var(--muted); font-weight: 600; }
.auth-secondary-actions { display: flex; flex-wrap: wrap; gap: 12px 20px; justify-content: space-between; margin-top: 20px; }
.support-public-layout { place-items: start center; }
.support-public-card { width: min(100%, 820px); padding: clamp(20px, 5vw, 38px); }
.support-public-card > .button:last-child { margin-top: var(--space-6); }

.hero-card { position: relative; min-height: 330px; overflow: hidden; padding: 24px; background: linear-gradient(148deg, #7B3F5C 0%, #9F5E7A 56%, #D88FA3 100%); color: white; }
.hero-card::after { content: ""; position: absolute; right: -70px; bottom: -110px; width: 250px; height: 250px; border: 55px solid rgb(255 255 255 / 0.10); border-radius: 50%; }
.hero-copy { position: relative; z-index: 1; display: grid; min-height: 280px; align-content: space-between; gap: 24px; }
.hero-card .eyebrow, .hero-card .lead { color: rgb(255 255 255 / 0.78); }
.hero-card h1 { max-width: 8ch; font-size: clamp(2.55rem, 12vw, 4.8rem); }
.hero-card .button { justify-self: start; background: white; color: var(--wine); }
.progress-note { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.progress-track { width: 100%; height: 8px; overflow: hidden; border-radius: 20px; background: var(--sand-soft); }
.progress-track > span { display: block; height: 100%; border-radius: inherit; background: var(--wine); }
.progress-track[aria-valuenow="0"] > span { width: 0%; }
.progress-track[aria-valuenow="1"] > span { width: 20%; }
.progress-track[aria-valuenow="2"] > span { width: 40%; }
.progress-track[aria-valuenow="3"] > span { width: 60%; }
.progress-track[aria-valuenow="4"] > span { width: 80%; }
.progress-track[aria-valuenow="5"] > span { width: 100%; }
.decision-card { display: grid; min-height: 202px; align-content: space-between; gap: 20px; padding: 20px; overflow: hidden; }
.decision-card[data-tone="rose"] { background: linear-gradient(145deg, #F9E6EB, #FFFCF9); }
.decision-card[data-tone="sand"] { background: linear-gradient(145deg, #E9DDD2, #FFFCF9); }
.decision-card[data-tone="wine"] { background: linear-gradient(145deg, #7B3F5C, #A76B84); color: white; }
.decision-card[data-tone="future"] { background: linear-gradient(145deg, #EDE8E3, #FFFCF9); }
.decision-card p { margin: 7px 0 0; color: inherit; opacity: 0.75; }
.decision-symbol { display: grid; width: 58px; height: 58px; place-items: center; border-radius: 22px; background: rgb(255 255 255 / 0.7); color: var(--wine); }
.coming-soon { display: inline-flex; width: fit-content; padding: 5px 9px; border-radius: var(--radius-pill); background: rgb(44 44 44 / 0.08); font-size: 0.68rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }

.onboarding-shell { width: min(100%, 780px); margin: 0 auto; }
.onboarding-progress { display: grid; gap: 8px; margin-bottom: 30px; }
.onboarding-progress ol { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; margin: 0; padding: 0; list-style: none; }
.onboarding-progress li { height: 5px; border-radius: 10px; background: var(--sand); }
.onboarding-progress li.active, .onboarding-progress li.done { background: var(--wine); }
.onboarding-content { display: grid; gap: 24px; }
.style-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.style-card { position: relative; display: grid; grid-template-rows: auto 1fr; min-width: 0; min-height: 196px; padding: 0; overflow: hidden; border: 2px solid transparent; border-radius: var(--radius-lg); background: var(--white); box-shadow: var(--shadow-soft); color: var(--charcoal); text-align: left; cursor: pointer; }
.style-card[aria-pressed="true"] { border-color: var(--wine); box-shadow: 0 0 0 3px rgb(123 63 92 / 0.12); }
.style-art { position: relative; display: block; width: 100%; height: 96px; overflow: hidden; background: var(--style-bg, var(--sand)); }
.style-art::before, .style-art::after { content: ""; position: absolute; border-radius: 44% 56% 58% 42%; transform: rotate(var(--style-angle, 10deg)); }
.style-art::before { inset: 19% 33% 9% 18%; background: var(--style-primary, var(--wine)); box-shadow: 18px 12px 0 var(--style-secondary, var(--rose)); }
.style-art::after { width: 52px; height: 72px; right: 14%; bottom: 13%; border: 8px solid rgb(255 252 249 / 0.72); background: transparent; }
.style-card-text { display: grid; gap: 4px; align-content: start; padding: 10px 13px 13px; }
.style-card-label { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 28px; font-weight: 750; line-height: 1.25; }
/* Длинное название не должно выталкивать отметку выбора за край карточки. */
.style-card-label > span:first-child { min-width: 0; overflow-wrap: anywhere; }
.style-check { flex: 0 0 auto; }
.style-card-hint { color: var(--ink-soft); font-size: 0.78rem; font-weight: 500; line-height: 1.38; overflow-wrap: anywhere; }
.style-card[aria-pressed="true"] .style-card-hint { color: var(--charcoal); }
.style-card:focus-visible, .occasion-option:focus-visible { outline: 3px solid var(--wine); outline-offset: 3px; }
.style-check { display: grid; width: 24px; height: 24px; place-items: center; border: 1px solid rgb(123 63 92 / 0.25); border-radius: 50%; color: transparent; }
.style-card[aria-pressed="true"] .style-check { border-color: var(--wine); background: var(--wine); color: white; }
.occasion-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.occasion-option { min-height: 66px; justify-content: flex-start; border-radius: var(--radius-md); white-space: normal; text-align: left; }
.exploration-control { display: grid; gap: 18px; padding: 22px; }
.exploration-options { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
.exploration-option { display: grid; gap: 4px; min-width: 0; min-height: 44px; padding: 13px 15px; border: 1px solid rgb(123 63 92 / 0.18); border-radius: var(--radius-md); background: var(--white); text-align: left; cursor: pointer; }
.exploration-option-label { font-weight: 750; line-height: 1.3; }
.exploration-option-hint { color: var(--ink-soft); font-size: 0.82rem; font-weight: 500; line-height: 1.4; overflow-wrap: anywhere; }
.exploration-option[aria-pressed="true"] .exploration-option-hint { color: rgb(255 255 255 / 0.86); }
.exploration-option:focus-visible { outline: 3px solid var(--wine); outline-offset: 3px; }
@media (min-width: 620px) { .exploration-options { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.exploration-option[aria-pressed="true"] { border-color: var(--wine); background: var(--wine); color: white; }
.exploration-line { position: relative; height: 4px; margin: 0 12%; border-radius: 5px; background: linear-gradient(90deg, var(--sand), var(--rose), var(--wine)); }
.exploration-line::before { content: ""; position: absolute; top: 50%; left: var(--exploration-position, 50%); width: 18px; height: 18px; border: 4px solid var(--white); border-radius: 50%; background: var(--wine); box-shadow: 0 2px 8px rgb(81 48 57 / 0.3); transform: translate(-50%, -50%); }
.summary-list { display: grid; gap: 12px; margin: 0; }
.summary-list > div { padding: 14px 0; border-bottom: 1px solid rgb(123 63 92 / 0.10); }
.summary-list dt { color: var(--ink-soft); font-size: 0.82rem; }
.summary-list dd { margin: 5px 0 0; font-weight: 750; }
.summary-hint { display: block; margin-top: 4px; color: var(--ink-soft); font-size: 0.82rem; font-weight: 500; line-height: 1.4; }
.pref-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.pref-chips li { padding: 5px 11px; border: 1px solid rgb(123 63 92 / 0.18); border-radius: var(--radius-pill); background: rgb(255 252 249 / 0.78); font-size: 0.88rem; font-weight: 650; line-height: 1.35; overflow-wrap: anywhere; }
.pref-chips-empty { color: var(--ink-soft); font-weight: 500; }
.conflict-banner { padding: 17px; border: 1px solid rgb(155 107 54 / 0.25); border-radius: var(--radius-md); background: rgb(155 107 54 / 0.09); }
.conflict-banner h3 { font-family: inherit; }

.toolbar { display: grid; gap: 12px; }
.search-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 9px; }
.wardrobe-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.garment-card { position: relative; min-width: 0; overflow: hidden; text-decoration: none; }
.garment-card-media { position: relative; display: grid; height: 190px; place-items: center; overflow: hidden; border-radius: var(--radius-lg); background: radial-gradient(circle at 50% 56%, rgb(216 143 163 / 0.18), transparent 46%), var(--sand-soft); }
.garment-card-media img { width: 88%; height: 88%; object-fit: contain; filter: drop-shadow(0 12px 14px rgb(81 48 57 / 0.13)); }
.garment-card-copy { padding: 11px 4px 17px; }
.garment-card-copy strong, .garment-card-copy span { display: block; }
.garment-card-copy span { margin-top: 4px; color: var(--ink-soft); font-size: 0.8rem; }
.media-placeholder { display: grid; width: 74%; height: 74%; place-items: center; border: 1px dashed rgb(123 63 92 / 0.24); border-radius: 45% 55% 50% 48%; color: var(--wine); text-align: center; }
.outfit-card { display: grid; min-height: 320px; overflow: hidden; }
.outfit-stage { position: relative; min-height: 228px; overflow: hidden; background: radial-gradient(circle at 50% 48%, rgb(216 143 163 / 0.17), transparent 44%), var(--sand-soft); }
.outfit-piece { position: absolute; display: grid; place-items: center; width: 48%; height: 58%; }
.outfit-piece img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 12px 13px rgb(81 48 57 / 0.13)); }
.outfit-piece[data-role="upper"] { top: 3%; left: 5%; }
.outfit-piece[data-role="outer"] { top: 5%; right: 3%; z-index: 2; }
.outfit-piece[data-role="lower"] { right: 14%; bottom: 0; height: 54%; }
.outfit-piece[data-role="full"] { top: 4%; left: 12%; width: 60%; height: 90%; }
.outfit-piece[data-role="full"] + .outfit-piece[data-role="outer"] { right: 2%; width: 46%; }
.outfit-copy { display: grid; gap: 11px; padding: 17px; }
.outfit-meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; }

.composer-board { position: relative; display: grid; min-height: 430px; place-items: center; overflow: hidden; padding: 22px; background: radial-gradient(circle at 50% 48%, rgb(216 143 163 / 0.22), transparent 48%), var(--sand-soft); }
.composer-stack { position: relative; width: min(100%, 390px); height: 370px; }
.composer-slot { position: absolute; display: grid; place-items: center; border: 1px dashed rgb(123 63 92 / 0.18); border-radius: var(--radius-xl); color: var(--ink-soft); }
.composer-slot img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 15px 16px rgb(81 48 57 / 0.14)); }
.composer-slot[data-role="upper"] { top: 0; left: 2%; width: 54%; height: 52%; }
.composer-slot[data-role="outer"] { top: 2%; right: 0; width: 52%; height: 56%; z-index: 3; }
.composer-slot[data-role="lower"] { right: 12%; bottom: 0; width: 50%; height: 56%; }
.composer-slot[data-role="full"] { top: 0; left: 12%; width: 62%; height: 96%; }
.composer-slot.empty { background: rgb(255 252 249 / 0.45); }
.composer-slot-actions { position: absolute; z-index: 4; top: 5px; right: 5px; display: flex; gap: 4px; }
.composer-slot-actions button { width: 34px; height: 34px; border: 0; border-radius: 50%; background: rgb(255 252 249 / 0.9); cursor: pointer; }
.picker-rail { display: grid; grid-auto-flow: column; grid-auto-columns: 112px; gap: 10px; overflow-x: auto; padding: 6px 2px 14px; scroll-snap-type: inline mandatory; }
.picker-item { display: grid; min-height: 134px; padding: 8px; border: 1px solid transparent; border-radius: var(--radius-md); background: var(--white); scroll-snap-align: start; cursor: pointer; }
.picker-item[aria-pressed="true"] { border-color: var(--wine); }
.picker-item .garment-card-media { height: 90px; border-radius: 14px; }
.picker-item small { align-self: end; margin-top: 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.empty-state { display: grid; min-height: 260px; place-items: center; align-content: center; gap: 13px; padding: 30px 22px; text-align: center; }
.empty-symbol { display: grid; width: 72px; height: 72px; place-items: center; border-radius: 28px; background: var(--rose-soft); color: var(--wine); }
.empty-state p { max-width: 38ch; margin: 0; color: var(--ink-soft); }
.profile-hero { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 16px; }
.profile-avatar { display: grid; width: 82px; height: 82px; overflow: hidden; place-items: center; border-radius: 50%; background: var(--rose-soft); color: var(--wine); font-family: Georgia, serif; font-size: 2rem; }
.profile-avatar img { width: 100%; height: 100%; object-fit: cover; }
.settings-list { display: grid; overflow: hidden; }
.language-card { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.language-card .muted { margin: var(--space-1) 0 0; }
.language-select { width: min(100%, 12rem); flex: 0 0 auto; }
.legal-language-note { margin: 0; padding: var(--space-2) var(--space-4); border-inline-start: 3px solid var(--wine); color: var(--ink-soft); font-size: .875rem; }
.plan-grid { display: grid; gap: var(--space-4); grid-template-columns: repeat(2, minmax(0, 1fr)); margin-block-end: var(--space-4); }
.plan-current, .plan-allowance, .future-plan { display: flex; flex-direction: column; gap: var(--space-2); }
.plan-price-status { display: inline-flex; width: fit-content; border-radius: var(--radius-pill); background: var(--sand-soft); color: var(--ink-soft); padding: var(--space-1) var(--space-2); font-size: .875rem; }
.plan-tryon-count { display: flex; align-items: baseline; gap: var(--space-2); margin: 0; }
.plan-tryon-count strong { color: var(--wine); font-family: var(--font-display); font-size: clamp(3rem, 12vw, 5.5rem); line-height: .9; }
.future-plan { flex-direction: row; align-items: center; justify-content: space-between; }
.settings-row { display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 12px; min-height: 68px; padding: 10px 16px; border: 0; border-bottom: 1px solid rgb(123 63 92 / 0.09); background: transparent; color: inherit; text-align: left; text-decoration: none; cursor: pointer; }
.settings-row:last-child { border-bottom: 0; }
.settings-icon { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 17px; background: var(--sand-soft); color: var(--wine); }
.settings-row strong, .settings-row small { display: block; }
.settings-row small { margin-top: 3px; color: var(--ink-soft); }

.support-center { display: grid; gap: var(--space-6); min-width: 0; }
.support-heading { max-width: 64ch; }
.support-heading .screen-heading h1 { margin-block: var(--space-1) var(--space-2); }
.support-heading .lead { margin: 0; }
.support-section { display: grid; gap: var(--space-4); min-width: 0; }
.support-section-heading { display: flex; align-items: end; justify-content: space-between; gap: var(--space-3); }
.support-section-heading h2 { margin-top: var(--space-1); }
.support-section-heading .caption { max-width: 28ch; margin: 0; text-align: right; }
.faq-category-list { display: grid; gap: var(--space-4); min-width: 0; }
.faq-category { overflow: hidden; min-width: 0; }
.faq-category-heading { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-4); background: var(--sand-soft); }
.faq-category-heading h2 { margin: 0; color: var(--wine-strong); font-family: var(--font-sans); font-size: .82rem; letter-spacing: .09em; }
.faq-item { border-top: 1px solid rgb(123 63 92 / 0.1); }
.faq-item h3 { margin: 0; }
.faq-question { display: grid; width: 100%; min-height: var(--touch); grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--space-3); padding: 15px var(--space-4); border: 0; background: transparent; color: var(--charcoal); font: inherit; font-weight: 750; line-height: 1.35; text-align: left; cursor: pointer; }
.faq-question:hover, .faq-question[aria-expanded="true"] { background: rgb(123 63 92 / 0.055); }
.faq-question:focus-visible { position: relative; z-index: 1; outline: 3px solid rgb(123 63 92 / 0.28); outline-offset: -3px; }
.faq-toggle { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 50%; background: var(--rose-soft); color: var(--wine); font-size: 1.25rem; }
.faq-answer { padding: 0 var(--space-4) var(--space-4); color: var(--ink-soft); }
.faq-answer p { max-width: 70ch; margin: 0; line-height: 1.65; }
.support-contact { display: grid; gap: var(--space-2); }
.support-contact h2, .support-contact .muted { margin: 0; }
.support-channel-list { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-2); }
.support-channel { flex: 1 1 150px; }
.support-unconfigured { padding-block: var(--space-2); }
.support-safety { display: flex; align-items: flex-start; gap: var(--space-2); margin: var(--space-3) 0 0; padding: var(--space-3); border-radius: var(--radius-md); background: var(--rose-soft); color: var(--charcoal); font-size: .95rem; line-height: 1.5; }
.support-safety svg { width: 22px; height: 22px; flex: 0 0 22px; color: var(--wine); }
.support-privacy-link { flex: 0 0 auto; }

.vto-separation { display: grid; gap: 12px; }
.media-concept { display: grid; grid-template-columns: 74px 1fr; gap: 14px; align-items: center; padding: 14px; }
.media-concept-thumb { display: grid; width: 74px; height: 88px; overflow: hidden; place-items: center; border-radius: 24px; background: var(--sand-soft); color: var(--wine); }
.media-concept.avatar .media-concept-thumb { width: 74px; height: 74px; border-radius: 50%; }
.media-concept-thumb img { width: 100%; height: 100%; object-fit: cover; }
.vto-photo-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.vto-photo { position: relative; overflow: hidden; border: 2px solid transparent; border-radius: var(--radius-lg); background: var(--sand-soft); }
.vto-photo[aria-pressed="true"] { border-color: var(--wine); }
.vto-photo img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }
.vto-photo figcaption { padding: 10px; font-weight: 700; }

.privacy-list { display: grid; gap: 12px; }
.privacy-document { overflow: hidden; }
.privacy-document summary { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 12px; min-height: 64px; padding: 14px 16px; cursor: pointer; font-weight: 750; }
.privacy-document-body { max-height: 300px; overflow: auto; padding: 0 16px 18px; color: var(--ink-soft); white-space: pre-wrap; }
.consent-row { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 12px; padding: 14px 0; border-bottom: 1px solid rgb(123 63 92 / 0.09); }
.consent-row:last-child { border-bottom: 0; }
.consent-row strong, .consent-row small { display: block; }
.consent-row small { margin-top: 4px; color: var(--ink-soft); }
.intake-preview { display: grid; min-height: 280px; place-items: center; overflow: hidden; border-radius: var(--radius-lg); background: var(--sand-soft); }
.intake-preview img { width: 100%; max-height: 480px; object-fit: contain; }
.file-button { position: relative; overflow: hidden; }
.file-button input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.review-choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.review-choice { min-height: 74px; padding: 12px; border: 1px solid rgb(123 63 92 / 0.18); border-radius: var(--radius-md); background: var(--white); text-align: left; cursor: pointer; }
.review-choice[aria-pressed="true"] { border-color: var(--wine); box-shadow: 0 0 0 2px rgb(123 63 92 / 0.10); }
.viewer { width: 100vw; max-width: none; height: 100dvh; max-height: none; margin: 0; padding: 0; border: 0; background: #171416; color: white; }
.viewer::backdrop { background: #171416; }
.viewer-toolbar { position: fixed; z-index: 2; top: calc(var(--safe-top) + 10px); right: max(12px, var(--safe-right)); left: max(12px, var(--safe-left)); display: flex; justify-content: space-between; }
.viewer-stage { display: grid; width: 100%; height: 100%; place-items: center; overflow: hidden; touch-action: none; }
.viewer-stage img { max-width: 100%; max-height: 100%; object-fit: contain; transform: translate3d(var(--pan-x, 0), var(--pan-y, 0), 0) scale(var(--zoom, 1)); transform-origin: center; will-change: transform; }
.launch-blocked { width: min(100%, 620px); margin: 8vh auto 0; }
.stylist-test-note { max-width: 680px; margin-bottom: 24px; }
.stylist-dialogue { display: grid; gap: 28px; max-width: 780px; }
.stylist-turn { display: grid; gap: 14px; min-width: 0; }
.stylist-question { margin: 0 0 0 28px; padding: 18px 22px; border-radius: 18px 18px 4px 18px; background: #f0e5df; font-size: 18px; line-height: 1.5; }
.stylist-question .eyebrow { display: block; margin-bottom: 6px; }
.stylist-answer { display: grid; gap: 14px; }
.stylist-answer-text { margin: 0; font-size: 18px; line-height: 1.65; white-space: pre-line; overflow-wrap: anywhere; }
.stylist-owned { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.stylist-owned li { border-left: 3px solid #754249; padding: 8px 12px; background: #faf6f1; }
.stylist-owned small { display: block; font-size: 13px; line-height: 1.4; color: #645b57; }
.stylist-shopping { display: grid; gap: 12px; margin-top: 10px; border-top: 1px solid #ded4cb; padding-top: 20px; min-width: 0; }
.stylist-products { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.stylist-product { overflow: hidden; min-width: 0; }
.stylist-product img { width: 100%; aspect-ratio: 3/4; object-fit: cover; }
.stylist-product h4 { font-size: 17px; line-height: 1.4; margin: 6px 0; overflow-wrap: anywhere; }
.stylist-product .button { white-space: normal; margin-top: 12px; }
.stylist-form { max-width: 780px; margin: 24px 0 16px; display: grid; gap: 12px; }
.stylist-form textarea { width: 100%; min-height: 100px; padding: 14px; font: inherit; line-height: 1.5; resize: vertical; color: inherit; background: #fffdf9; border: 1px solid #d7cbc3; border-radius: 10px; }
.stylist-form textarea[disabled] { background: #f3ece6; color: #6d635e; }
.stylist-suggestions { display: flex; flex-wrap: wrap; gap: 8px; }
.stylist-suggestions .chip { white-space: normal; text-align: left; font-weight: 600; font-size: 15px; line-height: 1.35; }
.stylist-answer.is-local { border-left: 3px solid #b0a49c; background: #faf7f4; }
.stylist-product.is-recommended { border: 2px solid #754249; }
.stylist-rank { margin: 10px 12px 0; color: #754249; }
.stylist-why { margin: 0 0 6px; font-size: 15px; line-height: 1.55; overflow-wrap: anywhere; }
.stylist-variants { list-style: none; margin: 0 0 8px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.stylist-variants a { display: inline-block; padding: 6px 10px; border: 1px solid #d7cbc3; border-radius: 8px; font-size: 14px; }
.stylist-archive { max-width: 780px; }
.stylist-archive-turn { display: grid; gap: 8px; padding: 12px 0; border-top: 1px solid #e6ddd5; }
@media(max-width: 560px) {
  .stylist-products { grid-template-columns: 1fr; }
  .stylist-answer-text, .stylist-question { font-size: 17px; }
  .stylist-question { margin-left: 12px; padding: 16px; }
  .stylist-suggestions .chip { width: 100%; }
}

/* The saved outfit. Mobile first: one column, tap targets at least 44px. */
.stylist-outfit { max-width: 780px; display: grid; gap: 14px; border: 2px solid #754249; }
.stylist-outfit h3 { margin: 6px 0 0; font-size: 18px; }
.outfit-total { background: #faf6f1; border-radius: 10px; padding: 12px 14px; }
.outfit-total p { margin: 0 0 6px; font-size: 17px; line-height: 1.5; }
.outfit-total .caption { margin: 0; }
.outfit-items { display: grid; gap: 12px; }
.outfit-item { display: grid; grid-template-columns: 96px minmax(0,1fr); gap: 12px; overflow: hidden; min-width: 0; }
.outfit-item img { width: 96px; aspect-ratio: 3/4; object-fit: cover; }
.outfit-item .card-pad { padding: 10px 12px 12px 0; min-width: 0; }
.outfit-item h4 { font-size: 16px; line-height: 1.4; margin: 4px 0; overflow-wrap: anywhere; }
.outfit-item .button { white-space: normal; margin-top: 10px; min-height: 44px; display: inline-flex;
  align-items: center; justify-content: center; }
.outfit-alternatives { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 10px; }
.outfit-alternatives li { display: grid; grid-template-columns: 64px minmax(0,1fr); gap: 10px;
  border-top: 1px solid #e6ddd5; padding-top: 10px; }
.outfit-alternatives img { width: 64px; aspect-ratio: 3/4; object-fit: cover; }
.outfit-alternatives p { margin: 0 0 4px; font-size: 15px; line-height: 1.4; overflow-wrap: anywhere; }
.outfit-notes { margin: 0; padding-left: 18px; display: grid; gap: 4px; }
/* The narrow-screen rule that used to stack the picture full-width belonged to
   the old tall card. With the compact line it made one item 360 px wide and
   nearly 400 px tall, which is what pushed the message field three screens
   down. The compact line already fits 360 px, so it stays as it is. */

/* Earlier turns, folded. The current answer must be reachable without scrolling
   through every product grid the conversation has ever shown. */
.stylist-turn.is-earlier { border-left: 3px solid #ded4cb; padding: 10px 0 10px 12px; margin: 0 0 10px; }
.stylist-turn.is-earlier > summary { cursor: pointer; font-weight: 600; line-height: 1.45;
  min-height: 44px; display: flex; align-items: center; overflow-wrap: anywhere; }
.stylist-turn.is-earlier .stylist-answer-text { font-size: 16px; margin: 8px 0 4px; }

/* Compact outfit line: picture, what it is, what it costs, two taps. Everything
   else lives behind «Подробнее», so the message field stays reachable. */
.outfit-item { grid-template-columns: 72px minmax(0,1fr); gap: 10px; align-items: start; padding: 10px; }
.outfit-item img { width: 72px; aspect-ratio: 3/4; border-radius: 6px; }
.outfit-line { min-width: 0; }
.outfit-line h4 { font-size: 16px; line-height: 1.35; margin: 2px 0 4px; overflow-wrap: anywhere; }
.outfit-line .shop-price { margin: 0 0 8px; font-weight: 700; }
.outfit-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.button.compact { min-height: 44px; padding: 0 14px; font-size: 15px; display: inline-flex;
  align-items: center; justify-content: center; white-space: nowrap; }
.outfit-more > summary, .outfit-why > summary, .outfit-fine > summary,
.outfit-conditions > summary, .stylist-history > summary {
  cursor: pointer; min-height: 44px; display: flex; align-items: center; font-weight: 600; }
.outfit-more { margin-top: 8px; }
.outfit-more .caption, .outfit-more .stylist-why { margin: 4px 0; }
.outfit-conditions { margin: 4px 0 2px; }
.outfit-conditions ul { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 8px; }
.outfit-conditions li { line-height: 1.45; }
.outfit-conditions li small { display: block; color: #645b57; font-size: 13px; line-height: 1.4; }
.outfit-conditions li[data-verified="false"] { color: #8a2b2b; }
.outfit-mark { display: inline-block; width: 1.2em; font-weight: 700; }
.outfit-missing { margin: 6px 0; padding: 10px 12px; background: #fbf1ec; border-radius: 8px; }
.stylist-history { margin-top: 12px; }
/* The form sits right under the current answer, so opening the keyboard does
   not hide it behind the rest of the conversation. */
.stylist-form { margin: 16px 0; scroll-margin-bottom: 96px; }
.stylist-form textarea { min-height: 84px; }

/* An unfilled shelf is a short line, not a card of its own: it competes with
   the outfit for the top of the screen otherwise. */
.outfit-open { padding: 10px 12px; margin-top: 8px; }
.outfit-open p { margin: 4px 0 8px; font-size: 15px; line-height: 1.45; }
.stylist-outfit { gap: 10px; }
.stylist-outfit h3 { font-size: 17px; }

/* Denser controls, so one position is a line rather than a block. Tap targets
   stay 44 px tall — the height comes off padding and wrapping, not off size. */
.outfit-item { grid-template-columns: 64px minmax(0,1fr); gap: 10px; padding: 8px 10px; }
.outfit-item img { width: 64px; }
.outfit-line h4 { font-size: 15px; margin: 2px 0 2px; }
.outfit-line .shop-price { margin: 0 0 6px; font-size: 15px; }
.outfit-line .eyebrow { margin: 0; }
.button.compact { padding: 0 10px; font-size: 14px; }
.outfit-actions { gap: 6px; }
.outfit-more > summary { min-height: 36px; font-size: 14px; color: #645b57; }
.outfit-open { border-top: 1px solid #e6ddd5; padding: 8px 0 0; margin-top: 6px; }
.outfit-jump { align-self: start; }
.stylist-outfit .outfit-fine > summary { font-size: 14px; color: #645b57; min-height: 36px; }

/* Item on the first row, its controls on the second across the whole card. */
.outfit-item { grid-template-columns: 64px minmax(0,1fr); grid-auto-rows: min-content;
  align-items: start; row-gap: 6px; }
.outfit-item > .outfit-actions, .outfit-item > .outfit-more { grid-column: 1 / -1; }
.outfit-item > .outfit-more { margin-top: 0; }

/* The fitting, next to the composition it belongs to. */
.outfit-tryon { border-top: 1px solid #e6ddd5; padding-top: 10px; margin-top: 6px; display: grid; gap: 8px; }
.outfit-tryon h3 { margin: 0; }
.outfit-tryon p { margin: 0; font-size: 15px; line-height: 1.5; }
.outfit-tryon .button { min-height: 48px; margin-top: 4px; }
.outfit-tryon.is-stale { border-left: 3px solid #a8622b; padding-left: 10px; }
.tryon-result { width: 100%; max-width: 320px; border-radius: 10px; background: #f3ece6; }
.tryon-steps { list-style: none; margin: 6px 0 0; padding: 0; display: grid; gap: 8px; }
.tryon-steps li { display: grid; grid-template-columns: 64px minmax(0,1fr); gap: 10px; align-items: center; }
.tryon-steps img { width: 64px; border-radius: 6px; background: #f3ece6; }
.tryon-steps span { font-size: 14px; line-height: 1.4; overflow-wrap: anywhere; }

/* Keep the existing scale; vertical space belongs to content, not stretched rows. */
.profile-columns { align-items:start; align-content:start; }
.profile-columns > .screen-stack { align-content:start; align-items:start; }
.stylist-contexts { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.stylist-contexts .eyebrow,.stylist-contexts .caption { flex-basis:100%; }
.stylist-contexts [aria-pressed="true"] { border:2px solid var(--wine,#7b3f5c); }
.tryon-caption { font-size:16px; line-height:1.6; }
.stylist-clarification { padding:14px; background:var(--sand-soft,#f7efe7); border-radius:12px; }
#stylist-message { scroll-margin-block:90px; font-size:16px; }
.stylist-form:focus-within { scroll-margin-bottom:90px; }

.profile-columns { display:grid; gap:22px; }
.app-main:has(.profile-hero) { display:block; }
.app-main:has(.profile-hero) > * + * { margin-top:22px; }
.settings-row { grid-template-columns:42px minmax(0,1fr) 20px; }
.settings-row > svg { width:20px; height:20px; }
.settings-icon > svg { width:26px; height:26px; }


/* Product imports: bounded images and readable variant selection on phones. */
.shop-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:16px;align-items:start;}
.shop-product {overflow:hidden;min-width:0;}
.shop-product>img {width:100%;height:310px;object-fit:contain;background:#f6f1eb;display:block;}
.shop-product select {width:100%;min-width:0;max-width:100%;}
.shop-product p,.shop-product h2 {overflow-wrap:anywhere;}
.shop-forms {display:grid;gap:16px;}

.stylist-contexts .button {max-width:100%;min-width:0;white-space:normal;overflow-wrap:anywhere;text-align:left;}

.demo-owned-photo{width:110px;height:130px;max-width:110px;object-fit:contain}.prepared-input-photo{display:block;width:180px;max-width:100%;height:220px;object-fit:contain}

/* Persistent viewport navigation; no transformed page ancestor and no layout animation. */
@media(max-width:719px){.bottom-nav{bottom:var(--keyboard-inset,0px)}.app-shell{padding-bottom:calc(var(--nav-height) + var(--safe-bottom) + var(--keyboard-inset,0px) + 34px)}}
.selection-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px}
.selection-item{padding:12px;display:grid;gap:8px;text-align:left;cursor:pointer;border:2px solid transparent}
.selection-item[aria-pressed="true"],.selection-photo[aria-pressed="true"]{border:2px solid var(--wine)}
.selection-item img{width:100%;height:160px;object-fit:contain}.selection-item small{color:var(--wine)}
.selection-photos{display:flex;gap:12px;overflow-x:auto}.selection-photo{flex:0 0 108px;border:2px solid transparent;border-radius:16px;padding:5px;background:var(--sand-soft)}
.selection-photo img{width:94px;height:142px;object-fit:contain}.selection-photo span{display:block}
input,textarea,select{font-size:16px}.modal{max-height:calc(100dvh - 24px);overflow-y:auto}

/* --- Панель «+»: крестик как самостоятельная кнопка -------------------- */
/* Иконка не перехватывает нажатие: цель события — сама кнопка, а не svg. */
.sheet-close { width: 48px; height: 48px; flex: 0 0 48px; }
.sheet-close svg { pointer-events: none; }
.sheet-backdrop[data-sheet-backdrop] { cursor: pointer; }
.bottom-sheet { cursor: auto; }

/* --- Найти в магазинах: фильтры и порции результатов ------------------- */
.shop-filters { display: grid; gap: 12px; }
.shop-filter-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.shop-filter-row > label { font: inherit; color: var(--ink-soft); }
.shop-filter-row .select, .shop-filter-row .input { min-width: 0; flex: 1 1 150px; }
.shop-active-filters { display: flex; flex-wrap: wrap; gap: 8px; }
.shop-result-heading { display: grid; gap: 4px; }
.shop-result-heading h2 { margin: 0; }
.shop-more { display: grid; justify-items: center; gap: 6px; }
.shop-busy { display: flex; align-items: center; gap: 10px; }
.shop-busy::before { display: block; width: 18px; height: 18px; border: 2px solid var(--rose-soft); border-top-color: var(--wine); border-radius: 50%; content: ""; animation: onme-spin 0.9s linear infinite; }
@keyframes onme-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .shop-busy::before { animation: none; } }

/* --- Примерка рекомендаций -------------------------------------------- */
.outfit-actions .button.compact, .stylist-product .actions .button { min-height: var(--touch); }
.stylist-product .actions { display: flex; flex-wrap: wrap; gap: 8px; }
.tryon-scope { display: grid; gap: 6px; }
.tryon-scope .caption { margin: 0; }

/* --- Навыпуск / заправить --------------------------------------------- */
.wear-style { display: grid; gap: 8px; }
.wear-style-options { display: flex; flex-wrap: wrap; gap: 8px; }
.wear-style-options .button { min-height: var(--touch); }
.wear-style-options .button[aria-pressed="true"] { border-color: var(--wine); background: var(--rose-soft); }

/* v16.5.3 — recognisable items, compact history, primary action above the navigation. */
.item-list{list-style:none;margin:8px 0;padding:0;display:grid;gap:8px}
.item-row{display:grid;grid-template-columns:52px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:56px;min-width:0}
.item-thumb{width:52px;height:52px;border-radius:10px;overflow:hidden;background:#f3ece6;display:grid;place-items:center;flex:none;text-decoration:none}
.item-thumb.small{width:44px;height:44px;border-radius:8px}
.item-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.item-thumb-empty,.item-thumb .media-placeholder{font-size:10px;line-height:1.1;color:#7d706a;text-align:center;padding:2px}
.item-row-text{min-width:0}.item-row-text strong{display:block;font-size:15px;line-height:1.3;overflow-wrap:anywhere}
.item-row-text small{display:block;color:#665c57;font-size:13px;line-height:1.3;overflow-wrap:anywhere}
.item-row .button{min-height:44px}
.item-strip{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.item-more{font-size:13px;color:#665c57}
.dialogue-bar{display:grid;gap:10px}.dialogue-bar h2{font-size:18px;line-height:1.3;margin:2px 0 0;overflow-wrap:anywhere}
.history-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.history-entry{display:grid;gap:6px;width:100%;padding:12px;border:1px solid rgb(123 63 92 / .14);border-radius:14px;background:#faf6f1;color:inherit;font:inherit;text-align:left;cursor:pointer}
.history-entry[aria-current="true"]{border-color:#754249;box-shadow:inset 0 0 0 1px #754249}
.history-entry strong{overflow-wrap:anywhere}.history-entry small{color:#665c57}
.panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.primary-dock{position:sticky;bottom:calc(var(--nav-height) + var(--safe-bottom) + var(--keyboard-inset,0px) + 8px);z-index:5;display:grid;gap:8px;margin:12px 0;padding:10px;border-radius:16px;background:rgb(255 252 249 / .97);box-shadow:0 -6px 22px rgb(81 48 57 / .12)}
.primary-dock .button{width:100%}
@media(min-width:900px){.primary-dock{bottom:12px}}
.ready-banner{position:fixed;z-index:45;left:12px;right:12px;bottom:calc(var(--nav-height) + var(--safe-bottom) + 12px);display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:14px;background:#754249;color:#fff;box-shadow:0 10px 28px rgb(44 24 30 / .3)}
.ready-banner .button{background:#fff;color:#754249;min-height:44px}
.saved-note{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.look-detail .tryon-result{max-width:100%}
.app-main{overflow-wrap:anywhere}

/* v16.5.5 — tariffs and payment conditions in «Мой доступ» */
.tariff { padding: 14px 0 6px; border-top: 1px solid rgb(123 63 92 / 0.12); }
.tariff h3 { margin: 0 0 6px; font-size: 1.02rem; line-height: 1.35; }
.tariff p { margin: 0 0 8px; }
.tariff-total { gap: 0; }
.tariff-total > div { padding: 8px 0; }
.tariff-status { margin: 8px 0 4px; color: var(--wine); font-weight: 750; }
.tariff-rules summary { cursor: pointer; min-height: var(--touch); display: flex; align-items: center; font-weight: 700; color: var(--wine); }
.tariff-rules p { margin: 0 0 10px; }
/* Подборка многих фото: общий разбор и карточка вещи */
.button.compact { min-height: 38px; padding: 8px 13px; font-size: 0.86rem; }
.batch-entry { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.batch-entry .caption { margin: 4px 0 0; }
.batch-add .actions, .batch-send .actions { flex-wrap: wrap; }
.batch-send { border: 1px solid rgb(123 63 92 / 0.22); background: var(--rose-soft); }
.batch-send .caption { margin: 4px 0 10px; }
.batch-summary .caption { margin: 4px 0 0; }
.batch-summary-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.batch-summary .progress-track > span { transition: width .3s ease; }
.batch-stale { margin: 8px 0 0; }
.batch-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.batch-card { position: relative; min-width: 0; display: flex; flex-direction: column; border: 2px solid transparent; border-radius: var(--radius-lg); background: var(--white); box-shadow: var(--shadow-soft); overflow: hidden; }
.batch-card[data-selected="true"] { border-color: var(--wine); box-shadow: 0 0 0 3px rgb(123 63 92 / 0.14); }
.batch-card-media { position: relative; aspect-ratio: 3 / 4; max-width: 100%; background: var(--sand-soft); }
.batch-card-open { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: transparent; cursor: pointer; }
.batch-card-open img { width: 100%; height: 100%; object-fit: cover; }
.batch-card-open .media-placeholder { width: 100%; height: 100%; border: 0; border-radius: 0; }
.batch-number { position: absolute; top: 8px; left: 8px; padding: 3px 8px; border-radius: var(--radius-pill); background: rgb(255 255 255 / 0.92); color: var(--charcoal); font-size: 0.74rem; font-weight: 800; pointer-events: none; }
.batch-select { position: absolute; top: 6px; right: 6px; display: grid; width: 34px; height: 34px; place-items: center; padding: 0; border: 2px solid var(--white); border-radius: 50%; background: rgb(44 44 44 / 0.28); color: white; cursor: pointer; }
.batch-select[aria-pressed="true"] { background: var(--wine); }
.batch-select svg { width: 18px; height: 18px; }
.batch-working { position: absolute; right: 8px; bottom: 8px; display: grid; width: 32px; height: 32px; place-items: center; border-radius: 50%; background: rgb(255 255 255 / 0.92); }
.batch-card-copy { display: grid; gap: 6px; padding: 10px 10px 12px; min-width: 0; }
.batch-card-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.batch-status { display: flex; align-items: center; gap: 6px; margin: 0; color: var(--ink-soft); font-size: 0.8rem; line-height: 1.3; }
.batch-dot { flex: 0 0 9px; width: 9px; height: 9px; border-radius: 50%; background: #9a9a9a; }
[data-tone="work"] .batch-dot { background: #6f8fb8; }
[data-tone="attention"] .batch-dot { background: #c98a2e; }
[data-tone="ok"] .batch-dot { background: #3f8f5b; }
[data-tone="error"] .batch-dot { background: #b8423c; }
.batch-card[data-tone="error"] { border-color: rgb(184 66 60 / 0.35); }
.batch-progress { display: block; height: 5px; overflow: hidden; border-radius: 5px; background: var(--sand-soft); }
.batch-progress > span { display: block; height: 100%; background: var(--wine); }
.batch-note { margin: 0; color: #9c3b35; font-size: 0.78rem; line-height: 1.35; }
.batch-card-actions:empty { display: none; }
.batch-card-actions .button { width: 100%; }
.batch-bulk { position: sticky; bottom: calc(var(--safe-bottom, 0px) + 86px); z-index: 5; margin-top: 12px; }
.batch-bulk:empty { display: none; }
.batch-bulk-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 10px; padding: 8px 10px; border-radius: var(--radius-lg); background: var(--white); box-shadow: 0 8px 26px rgb(81 48 57 / 0.18); }
.batch-bulk-inner > .caption { flex: 1 1 150px; margin: 0; font-size: 0.78rem; }
[data-batch-screen="list"] { padding-bottom: 12px; }
[data-batch-screen="list"] .batch-grid { padding-bottom: 72px; }
[data-batch-screen] .screen-heading .button { white-space: nowrap; }
.batch-bulk-inner .actions { align-items: center; }
.batch-done h2 { margin: 2px 0 10px; }
.batch-done .actions { flex-wrap: wrap; align-items: center; }
.batch-empty-filter { text-align: center; }
.batch-nav { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 4px; }
.batch-nav-steps { display: flex; gap: 6px; }
.batch-next-review { display: block; margin: 4px 0 8px auto; }
.batch-compare { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.batch-compare figure { margin: 0; min-width: 0; }
.batch-compare figcaption { margin-top: 4px; text-align: center; }
.batch-compare-media { display: grid; aspect-ratio: 3 / 4; max-width: 100%; place-items: center; overflow: hidden; border-radius: var(--radius-md); background: var(--sand-soft); }
.batch-compare-media img { width: 100%; height: 100%; object-fit: contain; }
.batch-compare-media .media-placeholder { width: 86%; height: 86%; }
.batch-detail-status { display: grid; gap: 6px; padding: 12px; border-radius: var(--radius-md); background: var(--sand-soft); }
.batch-detail-status .caption { margin: 0; }
.batch-detail-status[data-tone="attention"] { background: rgb(201 138 46 / 0.12); }
.batch-detail-status[data-tone="error"] { background: rgb(184 66 60 / 0.10); }
.batch-detail-status[data-tone="ok"] { background: rgb(63 143 91 / 0.10); }
.batch-clarify { display: grid; gap: 8px; padding: 12px; border: 1px solid rgb(201 138 46 / 0.4); border-radius: var(--radius-md); }
.batch-clarify .caption { margin: 0; }
.batch-clarify .actions { flex-wrap: wrap; }
.batch-links { display: grid; gap: 8px; padding: 12px; border-radius: var(--radius-md); background: var(--rose-soft); }
.batch-links .caption { margin: 0; }
.batch-links .actions { flex-wrap: wrap; align-items: center; }
.batch-saved { display: grid; gap: 10px; padding: 12px; border-radius: var(--radius-md); background: rgb(63 143 91 / 0.10); }
.batch-saved strong { display: flex; align-items: center; gap: 6px; }
.batch-saved svg { width: 18px; height: 18px; }
.batch-sheet { max-height: min(86dvh, 760px); overflow-y: auto; }
.batch-sheet h3 { margin: 6px 0 0; font-size: 0.95rem; }
.batch-pick-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.batch-pick { display: grid; gap: 4px; min-width: 0; padding: 4px; border: 1px solid rgb(123 63 92 / 0.14); border-radius: var(--radius-md); background: var(--white); text-align: left; cursor: pointer; }
.batch-pick .caption { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.item-photos h2 { margin: 0; font-size: 1.05rem; }
.item-photo { display: grid; gap: 4px; margin: 0; min-width: 0; }
.item-photo .quiet-link { font-size: 0.8rem; text-align: left; }
.item-photo-move { display: grid; gap: 4px; }
.item-photo-move .select { min-height: 36px; font-size: 0.8rem; }
@media (min-width: 720px) {
  .batch-grid { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 16px; }
  .batch-bulk { bottom: 16px; }
  .batch-pick-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 359px) {
  .batch-grid { gap: 9px; }
  .batch-pick-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .batch-entry { align-items: stretch; flex-direction: column; }
}
[data-batch-screen] .review-choice strong, [data-batch-screen] .review-choice .caption { display: block; }
[data-batch-screen] .review-choice .caption { margin-top: 2px; }
.item-photos .batch-pick-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 12px; }
.item-photo-move .select, .item-photo-move .button { width: 100%; }
@media (max-width: 430px) { .batch-entry { flex-direction: column; align-items: stretch; } .batch-entry .button { justify-content: center; } }
.batch-edit-error { display: grid; gap: 6px; padding: 10px 12px; border: 1px solid rgb(184 66 60 / 0.4); border-radius: var(--radius-md); background: rgb(184 66 60 / 0.07); }
.batch-edit-error .caption { margin: 0; }
.batch-edit-error .actions { flex-wrap: wrap; align-items: center; }
.batch-edit-pending { min-height: 1.4em; margin: 0; }
.batch-edit-pending[data-active="false"] { visibility: hidden; }

/* DAILY-RETURN-02: plan for today / tomorrow, events, history, reminders */
.daily-home { display: grid; gap: 12px; }
@media (min-width: 720px) { .daily-home { grid-template-columns: 1fr 1fr; } .daily-home .daily-links { grid-column: 1 / -1; } }
.daily-plan-card h2 { margin: 4px 0 8px; }
.daily-plan-card .actions, .daily-event .actions, .daily-history-row .actions { flex-wrap: wrap; }
.daily-warning { background: color-mix(in srgb, #b3261e 8%, transparent); border-left: 3px solid #b3261e; padding: 8px 10px; border-radius: 8px; }
.daily-links a { text-decoration: underline; }
.daily-choosing { border: 2px solid currentColor; }
.daily-focus { outline: 2px solid currentColor; outline-offset: 2px; }
.daily-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.day-chips { display: flex; flex-wrap: wrap; gap: 8px; border: 0; padding: 0; margin: 0; }
.day-chips legend { width: 100%; margin-bottom: 4px; }
.day-chips label { display: inline-flex; align-items: center; gap: 4px; min-height: 44px; padding: 0 10px; border: 1px solid rgba(0,0,0,.18); border-radius: 999px; }
.daily-history-row { border-top: 1px solid rgba(0,0,0,.08); padding-top: 12px; }
.daily-history-row:first-of-type { border-top: 0; padding-top: 0; }
.daily-plan-card .item-strip, .daily-event .item-strip, .daily-history-row .item-strip { margin-bottom: 12px; }

/* TRIP-WARDROBE-01 */
.trip-entry { margin-top: 12px; }
.trip-card h2 { margin: 4px 0 6px; }
.trip-counts { font-size: 1.05rem; margin: 0 0 6px; }
.trip-activities { display: grid; gap: 8px; border: 0; padding: 0; margin: 0; }
.trip-activities legend, .trip-optional legend { font-weight: 600; margin-bottom: 6px; }
.trip-activity { display: grid; grid-template-columns: auto 1fr 72px; align-items: center; gap: 10px; min-height: 44px; }
.trip-count { text-align: center; }
.trip-optional { display: grid; gap: 10px; }
.trip-optional summary { cursor: pointer; font-weight: 600; min-height: 44px; display: flex; align-items: center; }
.trip-optional fieldset { border: 0; padding: 0; margin: 8px 0 0; display: grid; gap: 4px; }
.trip-pick { display: flex; gap: 8px; align-items: center; min-height: 36px; }
.trip-outfit { border-top: 1px solid rgba(0,0,0,.08); padding-top: 12px; display: grid; gap: 8px; }
.trip-outfit:first-of-type { border-top: 0; padding-top: 0; }
.trip-items { display: flex; flex-wrap: wrap; gap: 8px; }
.trip-item { display: grid; justify-items: center; gap: 4px; width: 84px; background: none; border: 0; padding: 0; font: inherit; font-size: .8rem; text-align: center; cursor: pointer; color: inherit; }
.trip-item span:last-child { overflow-wrap: anywhere; }
.trip-missing { opacity: .55; }
.trip-broken { background: color-mix(in srgb, #b3261e 6%, transparent); border-radius: 8px; padding: 8px; }
.trip-gaps { display: grid; gap: 10px; }
.trip-gaps .actions { flex-wrap: wrap; margin-top: 8px; }
.trip-pack-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; }
.trip-pack { display: grid; grid-template-columns: 24px auto 1fr; gap: 10px; align-items: center; min-height: 52px; }
.trip-pack input { width: 22px; height: 22px; }
.trip-packed > span:last-child { text-decoration: line-through; opacity: .65; }
.trip-plan-form { display: grid; gap: 8px; }
.button.compact { min-height: 40px; padding: 8px 12px; }
/* A fieldset defaults to min-content width and would widen the whole form grid past the card. */
.trip-activities, .trip-optional fieldset { min-inline-size: 0; }
form[data-action="tr-save"] > *, .trip-optional > * { min-width: 0; }
.trip-activity .trip-count { width: 72px; }

/* Tariffs as cards (owner feedback 18.09.2026: the plain list was hard to read) */
.tariff-banner { padding: 12px 14px; border-radius: 12px; background: var(--rose-soft); color: var(--wine-strong); }
.tariff-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.tariff-card { display: grid; gap: 10px; align-content: start; padding: 16px; border: 1px solid rgb(123 63 92 / 0.14); border-radius: 16px; background: var(--card, #fff); }
.tariff-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.tariff-head h3 { margin: 0; font-size: 1.02rem; line-height: 1.3; }
.tariff-price { margin: 0; font-size: 1.5rem; font-weight: 800; color: var(--wine-strong); white-space: nowrap; }
.tariff-list { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.tariff-list li { position: relative; padding-left: 24px; line-height: 1.4; }
.tariff-list li::before { content: "✓"; position: absolute; left: 0; top: 0; color: var(--wine); font-weight: 800; }
.tariff-terms { margin: 0; }
.tariff-card .tariff-status { justify-self: start; margin: 0; padding: 6px 12px; border-radius: 999px; background: var(--sand-soft); font-size: .9rem; }
.tariff-notice { padding: 12px 14px; border-left: 3px solid var(--wine); border-radius: 0 12px 12px 0; background: var(--sand-soft); line-height: 1.55; }

/* Privacy documents as an accordion like the FAQ; no inner scroll, no internal version codes (18.09.2026) */
.privacy-document summary { list-style: none; }
.privacy-document summary::-webkit-details-marker { display: none; }
.privacy-document .faq-toggle::before { content: "+"; }
.privacy-document[open] .faq-toggle::before { content: "−"; }
.privacy-document[open] summary { background: rgb(123 63 92 / 0.055); }
.privacy-document-body { max-height: none; overflow: visible; white-space: normal; padding: 4px 16px 18px; line-height: 1.6; }
.privacy-document-body h3, .privacy-document-body h4, .privacy-document-body h5 { margin: 16px 0 6px; color: var(--charcoal); font-size: 1rem; }
.privacy-document-body p { margin: 0 0 10px; max-width: 72ch; }
.privacy-document-body ul { margin: 0 0 10px 18px; padding: 0; }

/* Privacy documents as an accordion like the FAQ; no inner scroll, no internal version codes (18.09.2026) */
.privacy-document summary { list-style: none; }
.privacy-document summary::-webkit-details-marker { display: none; }
.privacy-document .faq-toggle::before { content: "+"; }
.privacy-document[open] .faq-toggle::before { content: "−"; }
.privacy-document[open] summary { background: rgb(123 63 92 / 0.055); }
.privacy-document-body { max-height: none; overflow: visible; white-space: normal; padding: 4px 16px 18px; line-height: 1.6; }
.privacy-document-body h3, .privacy-document-body h4, .privacy-document-body h5 { margin: 16px 0 6px; color: var(--charcoal); font-size: 1rem; }
.privacy-document-body p { margin: 0 0 10px; max-width: 72ch; }
.privacy-document-body ul { margin: 0 0 10px 18px; padding: 0; }

/* ITEM-UX-02: only item reading/editing, product detail and daily-plan components. */
.item-detail{max-width:720px;margin-inline:auto;gap:18px}
.item-title h1,.product-detail-body h1{font-family:var(--font-body, sans-serif);font-size:26px;line-height:1.2;font-weight:600;margin:12px 0 0;overflow-wrap:anywhere}
.ownership-badge{display:inline-block;padding:6px 11px;border-radius:20px;font-size:13px;font-weight:600;background:#e8eee5;color:#425948}
.ownership-badge.wanted{background:#f0e1e8;color:#79425d}
.item-hero{position:relative;width:100%;height:clamp(270px,43dvh,440px);padding:16px;border:0;border-radius:22px;background:#f3ece6;display:grid;place-items:center;overflow:hidden;cursor:zoom-in}
.item-hero img{width:100%;height:100%;min-height:0;object-fit:contain}
.item-hero.item-no-photo{cursor:default;color:#6a615c}
.image-hint{position:absolute;bottom:10px;right:12px;padding:5px 10px;border-radius:14px;background:#fffaf5e8;color:#685860;font-size:12px}
.item-description{display:grid;gap:9px}.item-description p{margin:0}.item-description .quiet-link{justify-self:start}
.item-characteristics{font-size:15px;line-height:1.55;color:#625b56}
.item-detail-actions{display:grid;gap:10px}.item-detail-actions>.button{width:100%}.item-detail-actions .actions{gap:10px}
.item-detail-actions .actions .button{flex:1;font-size:14px}
.item-editor{padding:20px;border-radius:22px;background:#fffbf7}.item-editor h2{font:600 20px/1.3 var(--font-body,sans-serif);margin:0}.item-editor label{font-size:15px}.item-editor .input,.item-editor .select{font-size:16px}
.item-extra{border-top:1px solid #dfd5cf;padding-top:16px}.item-extra summary{padding:4px 0;min-height:44px;cursor:pointer;color:#79425d;font-weight:600}.item-extra>div{padding-top:12px}
.item-row .item-thumb{border:0;padding:0}.item-name-button{border:0;background:none;padding:0;text-align:left;color:inherit;font:600 15px/1.35 var(--font-body,sans-serif);overflow-wrap:anywhere;cursor:pointer;min-height:44px}
.product-detail-dialog{border:0;padding:0;width:min(100%,580px);max-width:100%;height:100dvh;max-height:100dvh;margin:0 auto;background:#faf6f1;color:#302b29;overflow:auto;overscroll-behavior:contain}
.product-detail-dialog::backdrop{background:#21151b80}.item-panel-header{position:sticky;top:0;z-index:1;background:#faf6f1;display:flex;align-items:center;justify-content:space-between;padding:calc(env(safe-area-inset-top,0px) + 12px) 20px 12px}
.product-detail-body{padding:0 20px calc(env(safe-area-inset-bottom,0px) + 26px);display:grid;gap:14px}.product-detail-body>p{margin:0}.product-detail-body h1{margin:0}.item-saved-price{font-size:24px;font-weight:600}.item-saved-price small{display:block;font-size:13px;font-weight:400;color:#685f5a}
.item-facts{display:grid;gap:10px;margin:0}.item-facts>div{display:grid;grid-template-columns:90px minmax(0,1fr);gap:12px;font-size:14px}.item-facts dt{color:#756c66}.item-facts dd{margin:0;overflow-wrap:anywhere}
.product-preview{display:block;width:100%;padding:0;border:0;background:transparent;cursor:pointer}.product-preview img{width:100%;object-fit:contain}
.daily-plan-card .day-heading{font-family:var(--font-body,sans-serif);font-size:21px;font-weight:600;line-height:1.3;margin:0 0 6px}.daily-plan-card .daily-look-title{font-size:14px;line-height:1.45;font-weight:400;color:#766961;margin:0 0 18px;overflow-wrap:anywhere}
.daily-plan-card .item-row{grid-template-columns:84px minmax(0,1fr);gap:14px}.daily-plan-card .item-thumb{width:84px;height:100px;border-radius:12px}.daily-plan-card .item-thumb img{object-fit:contain}.daily-plan-card .item-row-text strong{font-weight:600}.daily-plan-card .item-list{gap:16px}
.look-detail .item-row{grid-template-columns:76px minmax(0,1fr)}.look-detail .item-thumb{width:76px;height:90px}.look-detail .item-thumb img{object-fit:contain}.look-detail .item-row>.button{grid-column:2;justify-self:start;font-size:13px;padding:5px 12px;min-height:40px}
.look-detail h3{font-family:var(--font-body,sans-serif);font-size:20px;font-weight:600}
@media(min-width:720px){.product-detail-dialog{margin:auto;height:auto;max-height:92dvh;border-radius:24px}}

.viewer [hidden]{display:none}

/* SHOP-TO-LOOK-03: source tabs and the persistent composition picker. */
.shop-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.shop-tabs .chip{min-height:44px;white-space:normal}
.shop-tabs [aria-pressed="true"]{background:var(--ink,#292620);color:var(--paper,#fff);border-color:currentColor}
.selection-picker{border-top:1px solid var(--line,#ded8cf);padding-top:16px}
.selection-picker .selection-item{min-width:0}
.selection-picker .selection-item span{overflow-wrap:anywhere}
.selection-picker [aria-pressed="true"]{outline:2px solid var(--ink,#292620);outline-offset:-2px}
.tryon-scope{padding:14px;background:var(--sand,#f4eee7);border-radius:12px}
.tryon-scope p{margin-top:8px}
.shop-extra{display:grid;gap:12px}.shop-extra[open] label{display:block;margin-top:12px}
.shop-product h3{overflow-wrap:anywhere}
@media(max-width:360px){.composer-composition .item-row .button.compact{white-space:normal;max-width:115px}.selection-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

.composer-composition>.item-list>.item-row,.composer-composition>.item-list>li>.item-row{grid-template-columns:60px minmax(0,1fr);gap:8px 12px}
.composer-composition>.item-list .item-thumb{width:60px;height:72px}
.composer-composition>.item-list .item-row>.button{grid-column:2;justify-self:start;max-width:none;padding:5px 12px}
.shop-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.shop-tabs .chip{padding:10px 8px;line-height:1.3}

/* VALUE-PRICING-01: compact helpers, no competing primary action. */
.value-share-entry{margin:1rem 0;display:flex;justify-content:flex-start}.value-share-fallback{margin:1rem 0}.value-result-actions{margin-top:1rem;flex-wrap:wrap}.free-intro{padding:1rem;border-radius:1rem;background:var(--sand-50,#faf6f1)}.free-intro p{margin:.6rem 0}#tariffs .tariff-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr))}#tariffs .tariff-card{min-width:0}#result-problem-help code{overflow-wrap:anywhere}

/* CLEAR-UX-01: short primary information; independent, labelled details. */
#tariffs .tariff-banner{background:var(--sand-soft);margin:0;padding:12px 16px;border-radius:12px}
#tariffs .tariff-card{align-content:start;gap:12px;padding:20px}
#tariffs .tariff-list{margin:0;padding:0}
#tariffs .unit-valuation{border-top:1px solid var(--line,#e2d6da);padding-top:8px}
#tariffs .unit-valuation p{font-size:1rem;line-height:1.6;margin:8px 0}
.clear-help{display:grid;gap:0}.clear-help>details{padding:12px 0;border-top:1px solid var(--line,#e2d6da)}
.clear-help summary,.unit-valuation summary,.free-intro summary,.tryon-help summary{min-height:44px;cursor:pointer;padding:8px 0;line-height:1.5;font-weight:600;color:var(--wine)}
summary:focus-visible{outline:3px solid var(--wine);outline-offset:4px;border-radius:4px}
.tryon-units{padding:16px;border-radius:16px;background:var(--sand-soft);font-size:1rem;margin:16px 0}
.tryon-units dd{font-size:1.25rem;font-weight:700}.tryon-units>div{gap:10px;grid-template-columns:minmax(0,1fr) auto}
.tryon-plan-items{margin-block:12px}.tryon-help{margin-block:12px}.outfit-tryon>.button{width:100%;min-height:48px}
.daily-warning{background:var(--sand-soft);color:var(--charcoal);border-color:var(--line,#e2d6da)}
.screen-content h1,.screen-content h2,.card h2,.card h3,.card p,.card summary{overflow-wrap:anywhere}
.composer-composition .selection-picker{max-height:none}.composer-composition .item-row-text{min-width:0}
@media(max-width:380px){.style-card-text{padding:8px 11px 11px}.style-card-hint{font-size:0.74rem}}
@media(max-width:400px){#tariffs .tariff-head{display:grid;gap:8px}#tariffs .tariff-price{justify-self:start}.actions>.button{max-width:100%;white-space:normal}.summary-list>div{min-width:0}}
.tryon-units>div{display:grid;align-items:baseline;padding:8px 0}.tryon-units dt{font-size:1rem}.tryon-units dd{margin:0}
.screen-stack>*{min-width:0}.card .button{max-width:100%;white-space:normal;overflow-wrap:anywhere}.nav-link>span:last-child:not(.nav-icon){max-width:100%;overflow-wrap:anywhere;text-align:center}
@media(max-width:719px){.app-shell{padding-bottom:calc(var(--nav-height) + var(--safe-bottom) + var(--keyboard-inset,0px) + 3em)}}

/* HOME-SHARE-01: visible before the daily blocks; other sharing entry points unchanged. */
.home-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin-bottom: 20px; }
.home-heading h1 { min-width: 0; font-size: 2rem; line-height: 1.1; }
.home-heading .button { flex: 0 0 auto; min-height: 44px; padding: 10px 14px; white-space: nowrap; font-size: .875rem; }
.hero-card .home-hero-title { max-width: 8ch; font-size: clamp(2.55rem, 12vw, 4.8rem); line-height: .98; letter-spacing: -.035em; }
@media (max-width: 350px) { .home-heading h1 { flex-basis: 100%; } .home-heading { justify-content: flex-start; } }

.safe-product-url{overflow-wrap:anywhere;font-size:.875rem}.incoming-product{margin-bottom:16px}.easy-start-notice h2{font-size:1.25rem}

/* ONME-VISUAL-IMPLEMENT-01 — scoped to the three accepted screens. */
.visual-state{position:relative;padding:22px;border-radius:var(--radius-xl);background:linear-gradient(145deg,var(--wine),#9B5573);color:#fff;box-shadow:var(--shadow-raised);display:grid;gap:12px;align-content:start}
.visual-state .eyebrow,.visual-state p{color:#fff;margin:0}.visual-state h2{font-size:1.7rem;line-height:1.18;margin:0}.visual-state p{line-height:1.5;font-size:1rem}.visual-state .button{background:var(--white);color:var(--wine-strong);justify-self:start;margin-top:4px}
.visual-wardrobe{display:grid;gap:10px;align-content:start}.visual-wardrobe .panel-head{flex-wrap:wrap}.visual-thumb-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}.visual-thumb-row a{position:relative;min-height:46px;aspect-ratio:1;border-radius:12px;background:var(--sand-soft);overflow:hidden;display:grid;place-items:center}.visual-thumb-row img{width:100%;height:100%;object-fit:contain}.visual-thumb-row span{font-size:.8rem;text-align:center}
[data-home-context]{display:grid;gap:14px}.visual-collage{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:8px;border-radius:var(--radius-lg);background:linear-gradient(140deg,var(--sand-soft),var(--white))}.visual-piece{min-width:0;border-radius:var(--radius-md);background:var(--white);overflow:hidden;display:grid;align-content:start}.visual-piece.lead{grid-column:1/-1}.visual-piece-media{position:relative;height:170px;background:var(--ivory);display:grid;place-items:center}.visual-piece.lead .visual-piece-media{height:256px}.visual-piece-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.visual-piece-media .media-placeholder{padding:18px;text-align:center;line-height:1.4}.visual-piece-foot{display:grid;align-content:start;gap:8px;padding:12px;min-width:0}.visual-piece-foot h3{font-size:1rem;line-height:1.35;margin:0}.visual-piece-foot p{margin:0}.visual-origin{font-size:.78rem;color:var(--wine-strong);background:var(--rose-soft);border-radius:12px;padding:4px 8px;justify-self:start}.visual-piece .button{min-height:44px;font-size:.85rem;padding:9px;white-space:normal}.visual-piece *{overflow-wrap:anywhere}.visual-piece .outfit-alternatives{display:grid;grid-template-columns:minmax(0,1fr);padding:0}.visual-piece .outfit-alternatives li{display:grid;grid-template-columns:minmax(0,1fr)}
.stylist-outfit:has(.visual-collage){border:0;padding:16px;max-width:780px;gap:16px}.visual-fit-bar{position:sticky;bottom:calc(var(--visual-navigation-height,var(--nav-height)) + 8px);z-index:20;padding:14px;background:var(--white);border:1px solid var(--sand);border-radius:20px;box-shadow:var(--shadow-soft);margin:10px 0}.visual-fit-bar p{font-size:.85rem;line-height:1.4;margin:0 0 6px}.visual-fit-bar .actions{display:flex;flex-wrap:wrap;gap:8px}.visual-fit-bar .button{min-height:46px;white-space:normal}.visual-fit-bar .button:first-child{flex:1 1 180px}
.visual-result{display:grid;gap:12px;min-width:0}.visual-stage-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}.visual-compare{display:flex;gap:4px;flex-wrap:wrap;padding:4px;border-radius:24px;background:var(--sand-soft)}.visual-stage-head .button{min-height:44px}.visual-result-stage{border-radius:var(--radius-lg);overflow:hidden;background:var(--ivory)}.visual-result-stage img{display:block;width:100%;height:auto;max-height:none;object-fit:contain}.visual-result-stage img[hidden]{display:none}.visual-result-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.visual-result-actions .button{display:grid;gap:7px;min-height:80px;padding:12px 5px;border-radius:18px;font-size:.8rem;line-height:1.35;white-space:normal;overflow-wrap:anywhere}.visual-result-actions span{font-size:1.25rem}.visual-result .media-placeholder{display:block;min-height:160px;padding:28px;text-align:center}.visual-share-dialog{border:0;border-radius:24px;background:var(--ivory);color:var(--charcoal);padding:20px;width:min(500px,calc(100% - 24px));max-height:90dvh;overflow:auto}.visual-share-dialog::backdrop{background:rgb(30 20 30 / .55)}.visual-share-dialog>img{width:100%;max-height:45dvh;object-fit:contain;border-radius:16px;margin:14px 0}.visual-share-dialog .button,.visual-share-dialog .icon-button{min-height:44px;min-width:44px}.visual-share-dialog h2{font-size:1.3rem}.look-detail:has(.visual-result){max-width:780px;margin:auto}.look-detail #saved-look{padding:16px}.visual-result :focus-visible,.visual-piece :focus-visible,.visual-state :focus-visible{outline:3px solid var(--focus);outline-offset:3px}
@media(min-width:760px){.visual-collage{grid-template-columns:repeat(3,minmax(0,1fr))}.visual-piece.lead{grid-column:1/3}.visual-collage[data-count="1"] .visual-piece{grid-column:1/-1}.visual-piece-media{height:230px}.visual-piece.lead .visual-piece-media{height:300px}}
@media(max-width:360px){.visual-state{padding:18px}.visual-collage{gap:7px;padding:5px}.visual-piece-foot{padding:9px}.visual-piece-media{height:150px}.visual-piece.lead .visual-piece-media{height:218px}.visual-fit-bar .button{width:100%}}
@media(max-height:560px){.visual-fit-bar{position:static}}
.visual-fit-bar .visual-fit-actions .button{width:100%;margin:4px 0}.visual-fit-bar{padding:12px}.visual-fit-bar p:last-child{margin:4px 0 0;font-size:.78rem}

/* UX Polish 02: selected photo, preparation stage, distinct result actions. */
.import-photo-preview{margin:0;display:grid;gap:8px;min-width:0}
.import-photo-preview img{width:100%;max-height:240px;object-fit:contain;background:var(--ivory);border-radius:var(--radius-md)}
.import-photo-preview figcaption{font-size:.875rem;color:var(--ink-soft);line-height:1.45}
.ux-preparation .ux-stage-label{font-size:1rem;font-weight:700;color:var(--wine-strong)}
.visual-result-save{display:grid;gap:8px;padding:16px;background:var(--sand-soft);border-radius:var(--radius-md);min-width:0}
.visual-result-save>.button{width:100%;white-space:normal}
.visual-result-save .saved-note{margin:0;display:grid;gap:8px}
.visual-result-actions .button{font-size:.875rem;padding:12px 8px}
.app-main:has(.outfit-tryon) .screen-heading .card-header>div{min-width:0;width:100%}
.app-main:has(.outfit-tryon) .screen-heading{grid-template-columns:minmax(0,1fr)}
.app-main:has(.outfit-tryon) .screen-heading h1{overflow-wrap:anywhere}
@media(max-width:360px){.visual-result-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.visual-result-actions>.button:last-child{grid-column:1/-1;min-height:46px}}

/* Owner support queue. Scoped to support; customer screens remain unchanged. */
#onme-support-inbox {min-width:0; scroll-margin-top:1rem;}
.support-tabs {display:flex;flex-wrap:wrap;gap:.5rem;}
.support-tabs .button {min-width:0;white-space:normal;flex:1 1 8rem;}
.support-tabs [aria-pressed="true"] {background:var(--color-primary,#81415e);color:#fff;}
.support-search {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:.75rem;align-items:end;}
.support-search label {min-width:0;display:grid;gap:.35rem;}
.support-search .input {width:100%;min-width:0;}
.support-ticket,.support-message {padding:1rem 0;border-bottom:1px solid var(--color-border,#e9dfda);min-width:0;}
.support-text {white-space:pre-wrap;overflow-wrap:anywhere;}
.support-thread {min-width:0;}
#onme-support-inbox textarea {width:100%;min-width:0;box-sizing:border-box;}
#onme-support-inbox .button {max-width:100%;white-space:normal;}
#onme-support-inbox h3 {overflow-wrap:anywhere;}
@media(max-width:600px){.support-search{grid-template-columns:minmax(0,1fr);}}
.support-heading,.support-heading .card-header,.support-heading .card-header>div {min-width:0;max-width:100%}.support-heading .screen-heading h1 {overflow-wrap:anywhere}.support-jump {max-width:100%;white-space:normal;min-width:0}

/* Stylist: wrapping controls preserve readable type at narrow widths and text zoom. */
.stylist-condition-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:12px;margin-top:14px}
.stylist-condition-grid label{display:grid;gap:6px;min-width:0}.stylist-condition-grid .input{width:100%;min-width:0;box-sizing:border-box}
.stylist-conditions summary{cursor:pointer;line-height:1.5;overflow-wrap:anywhere}
.stylist-suggestions,.stylist-draft-choice{display:flex;flex-wrap:wrap;gap:8px}.stylist-draft-choice p{flex-basis:100%}
.stylist-form .button,.stylist-repair .button{white-space:normal;overflow-wrap:anywhere;max-width:100%}
.stylist-form textarea{width:100%;min-width:0;box-sizing:border-box;font:inherit}
.stylist-form :focus-visible,.stylist-repair :focus-visible{outline:3px solid #87516b;outline-offset:3px}

.stylist-form #stylist-message{font-size:max(1rem,16px)}
.stylist-condition-grid .input{font:inherit}
.stylist-form .stylist-suggestions .chip{font-size:.9375rem}

.onme-update-ready{position:relative;z-index:25;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;padding:.75rem 1rem;background:#fff8ea;border-bottom:1px solid #d9c5a4;color:#35273a;overflow-wrap:anywhere}
.onme-update-ready [data-update-status]{flex-basis:100%}
.first-fitting-home h2{font-size:1.35rem;line-height:1.35;overflow-wrap:anywhere}
.first-fitting-home .composer-composition{min-width:0}
.first-fitting-home .button{white-space:normal;overflow-wrap:anywhere}
.stylist-conditions h3{margin:0 0 .75rem}
.tryon-cost{font-weight:650}

.composer-composition.screen-stack{gap:12px}
.composer-composition>h3,.composer-composition>p{margin-block:0}
.composer-composition>.outfit-more{margin-block:0}
.first-fitting-inputs{display:flex;gap:8px;flex-wrap:wrap}
.first-fitting-inputs>.button{flex:1 1 130px;min-width:0}
.composer-composition .tryon-help{margin-block:4px}

/* Task panels retain the existing readable type and visible controls. */
.task-panel{padding:1rem;border:1px solid var(--line,#dacac7);border-radius:16px;background:var(--surface,#fff);min-width:0}.task-panel h3{margin:0}.condition-actions .button{white-space:normal;overflow-wrap:anywhere;text-align:left}.balance-line{font-size:1rem;margin:0;display:flex;gap:.5rem;flex-wrap:wrap}.task-panel .stylist-condition-grid{grid-template-columns:1fr}.task-panel input,.task-panel select{max-width:100%;min-width:0}.task-panel .button{white-space:normal}

/* Intake heading remains readable at 200% without widening the screen. */
.app-main:has(.intake-preview) .screen-heading .card-header>div{min-width:0;max-width:100%}
.app-main:has(.intake-preview) .screen-heading h1{overflow-wrap:anywhere}

/* REAL-USER-FLOW-REPAIR-02: coherent fitting and discoverable private results. */
.first-fitting-home {background:linear-gradient(150deg,var(--sand-soft),#fff9f6);border:1px solid #eadbd4;border-radius:26px;padding:20px;box-shadow:0 12px 32px rgb(81 48 57 / .07);min-width:0}
.first-fitting-home>h2,.first-fitting-home h2{margin-top:0}
.first-fitting-home .composer-composition{background:transparent;border:0;box-shadow:none;padding:0}
.fitting-photo-preview{height:260px;max-width:100%;border-radius:18px;background:#efe5df;overflow:hidden;display:flex;justify-content:center}
.fitting-photo-preview img{width:100%;height:100%;object-fit:contain}
.fitting-photo-empty{display:grid;gap:12px;place-items:center;border:1px dashed #b59f94;border-radius:18px;min-height:180px;padding:18px;text-align:center;background:#fffaf6}
.fitting-piece-row{display:flex;gap:12px;overflow:auto;margin:0;padding:2px 2px 8px;list-style:none;max-width:100%}
.fitting-piece{flex:0 0 124px;position:relative;display:grid;gap:8px;align-content:start;overflow-wrap:anywhere}
.fitting-piece>img,.fitting-piece>.media-placeholder{width:124px;height:130px;object-fit:contain;background:#fffaf6;border-radius:14px}
.fitting-piece .icon-button{position:absolute;top:4px;right:4px;background:#fffaf6;box-shadow:0 2px 6px #0002}
.fitting-piece>span:not(.media-placeholder){padding:0 4px;line-height:1.35}
.first-fitting-home .primary-dock{background:transparent;box-shadow:none;border:0;padding:12px 0}
.first-fitting-home .primary-dock>.button{min-height:54px;font-weight:700;box-shadow:0 6px 16px rgb(123 63 92 / .18)}
.result-card{overflow:hidden;padding:14px;min-width:0}.result-card-open{display:block;border:0;padding:0;background:none;color:inherit;width:100%;text-align:left;cursor:pointer;font:inherit;min-width:0}
.result-card-image{height:260px;display:grid;place-items:center;background:var(--sand-soft);border-radius:14px;overflow:hidden}
.result-card-image img{width:100%;height:100%;object-fit:contain}
.result-card-copy{display:grid;gap:6px;padding-top:12px;overflow-wrap:anywhere}.result-card-copy>span{color:var(--text-muted)}
.recent-result-row{display:flex;gap:12px;overflow:auto;max-width:100%}.recent-result{flex:0 0 190px;background:var(--sand-soft);border:0;border-radius:14px;padding:12px;display:grid;gap:10px;text-align:left;font:inherit;overflow-wrap:anywhere;cursor:pointer}
.route-loading{margin:0 0 8px;color:var(--text-muted)}
.visual-share-dialog img{-webkit-touch-callout:default;user-select:auto;max-height:55vh;object-fit:contain}
@media(max-width:430px){.first-fitting-home{padding:16px;border-radius:22px}.fitting-photo-preview{height:230px}.first-fitting-inputs{display:flex;flex-wrap:wrap}.first-fitting-inputs>.button{flex:1 1 130px}.result-card-image{height:240px}}

/* Actual item previews: don't stretch a saved selection to its neighbour's photo. */
.looks-grid { align-items:start;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr)); }
.looks-grid .result-card-image img { width:100%;height:100%;object-fit:contain; }
.look-preview { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;position:relative;padding:.75rem;min-width:0; }
.look-preview[data-count="1"] { grid-template-columns:1fr; }
.look-preview-item { display:flex;align-items:center;justify-content:center;min-width:0;height:150px;background:var(--color-surface,#fff);border-radius:12px;overflow:hidden; }
.look-preview[data-count="1"] .look-preview-item { height:230px; }
.look-preview-item img { width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain; }
.look-preview-more { grid-column:1/-1;text-align:center;font-size:1rem; }
.product-preview img[hidden],.look-preview-item img[hidden],.result-card-image img[hidden] { display:none; }
.product-preview.media-failed { height:auto;min-height:90px;padding:1rem; }
.product-preview.media-failed .media-placeholder { height:auto;white-space:normal; }
.shop-alternatives { border-top:1px solid var(--color-border,#ddd);padding-top:1rem; }
.product-preview { position:relative; }
.product-preview .media-loading { position:absolute;inset:0;display:grid;place-items:center;font-size:1rem;background:var(--color-surface,#f8f6f3); }
.image-recovery { padding:.75rem;flex-wrap:wrap; }

/* Addressed current result, alternatives and reversible history removal. */
.stylist-variant{padding-block:var(--space-4,16px);border-bottom:1px solid var(--border,#ddd)}
.stylist-variant .item-strip{flex-wrap:wrap}
.result-card{position:relative}.history-remove{position:relative;justify-self:end;margin:0 12px 12px;min-width:44px;min-height:44px}.look-view-head{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;margin-bottom:12px}.viewer-toolbar [data-viewer-delete]{white-space:normal}
.result-card-copy{padding-right:44px}
/* One fitting draft, compact garment selection and short intake. No fixed dock. */
.fitting-workspace,.fitting-picker-screen{max-width:48rem;margin-inline:auto;min-width:0}
.fitting-home-preview,.fitting-person{display:grid;grid-template-columns:7rem minmax(0,1fr);gap:1rem;align-items:center}
.fitting-home-preview>img{width:7rem;height:9rem;object-fit:contain;border-radius:1rem;background:var(--surface-soft,#f4ece7)}
.fitting-person-photo{width:7rem;aspect-ratio:3/4;background:var(--surface-soft,#f4ece7);border-radius:1rem;display:grid;place-items:center;overflow:hidden}
.fitting-person-photo img{width:100%;height:100%;object-fit:contain}
.fitting-person .eyebrow{margin:0}.fitting-person strong{overflow-wrap:anywhere}
.fitting-garments{list-style:none;margin:0;padding:0;display:grid;gap:.75rem}
.fitting-garment{display:grid;grid-template-columns:5rem minmax(0,1fr);gap:.75rem;align-items:center;padding:.5rem 0;border-bottom:1px solid var(--border-soft,#e9dfd9)}
.fitting-garment>img,.fitting-garment>.media-placeholder{width:5rem;height:6rem;object-fit:contain;background:var(--surface-soft,#f4ece7);border-radius:.75rem}
.fitting-garment>div{display:grid;gap:.4rem;min-width:0}.fitting-garment strong{overflow-wrap:anywhere}
.fitting-piece-actions,.fitting-add-actions,.fitting-secondary{display:flex;gap:.5rem;flex-wrap:wrap}
.fitting-piece-actions .button{min-height:2.75rem;white-space:normal;padding:.5rem .7rem}
.fitting-add-actions .button{flex:1 1 10rem;white-space:normal}
.picker-heading{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.picker-heading h1{margin:0;min-width:0;overflow-wrap:anywhere}
.picker-heading button{flex-shrink:0;white-space:normal}
.fitting-picker-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}
.fitting-choice{display:grid;grid-template-rows:auto auto auto;gap:.5rem;align-content:start;text-align:left;padding:.65rem;min-width:0;white-space:normal;font-size:inherit;font-family:inherit;color:inherit}
.fitting-choice img,.fitting-choice .media-placeholder{width:100%;height:9rem;object-fit:contain;background:var(--surface-soft,#f4ece7);border-radius:.6rem}
.fitting-choice strong,.fitting-choice span{overflow-wrap:anywhere}.fitting-choice>span:last-child{color:var(--wine,#803b59);padding:.4rem 0}
.fitting-choice:disabled{opacity:.6}.fitting-choice:focus-visible,.picker-heading :focus-visible{outline:3px solid var(--wine,#803b59);outline-offset:3px}
.wardrobe-quick-card{min-width:0;display:grid;align-content:start;gap:.4rem}.wardrobe-quick-card>.button{margin-inline:.25rem}
.wardrobe-quick-card .garment-card{height:auto}.wardrobe-quick-card .garment-media{max-height:13rem}
.intake-short{max-width:30rem;margin-inline:auto}.intake-short .intake-preview{height:13rem;min-height:0}
.intake-short .intake-preview{grid-template-rows:minmax(0,1fr)}
.intake-short .intake-preview img{height:100%;width:100%;max-height:100%;min-height:0;object-fit:contain}
.intake-extra,.batch-extra{border-top:1px solid var(--border-soft,#e9dfd9);padding-top:.7rem}
.intake-extra>summary,.batch-extra>summary{cursor:pointer;min-height:2.75rem;padding:.5rem 0;font-weight:600}
.intake-extra>.screen-stack,.batch-extra>.screen-stack{padding-top:.6rem}.intake-known{margin:.25rem 0}
.intake-photo-options{display:flex;flex-wrap:wrap;gap:.5rem;border:0;padding:0;margin:0}.intake-photo-options legend{margin-bottom:.5rem}
.fitting-workspace .outfit-tryon{margin-top:0}.fitting-secondary{padding:.5rem 0}
.fitting-picker-screen #fitting-query{scroll-margin-block:5rem}
@media(min-width:720px){.fitting-picker-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:360px){.fitting-person,.fitting-home-preview{grid-template-columns:5rem minmax(0,1fr);gap:.7rem}.fitting-person-photo,.fitting-home-preview>img{width:5rem}.picker-heading{align-items:flex-start;flex-wrap:wrap}}
.batch-detail-original { margin: 0; }
.batch-detail-original img { display: block; width: 100%; max-height: 240px; object-fit: contain; }
/* Wardrobe cards may wrap at large text sizes without widening the grid. */
.app-main:has(.wardrobe-grid) .screen-heading .card-header>div{min-width:0;max-width:100%}
.app-main:has(.wardrobe-grid) .screen-heading h1{overflow-wrap:anywhere}
.wardrobe-quick-card .garment-card,.wardrobe-quick-card .garment-card-media,.wardrobe-quick-card .garment-card-copy{min-width:0;max-width:100%}
.wardrobe-quick-card .garment-card-copy{overflow-wrap:anywhere}
.wardrobe-quick-card>.button{min-width:0;max-width:calc(100% - .5rem);white-space:normal;overflow-wrap:anywhere;box-sizing:border-box}

/* Claude F01-F15: reachable actions with the actual navigation height. */
.fitting-primary,.intake-primary{position:fixed;z-index:21;bottom:calc(var(--visual-navigation-height,var(--nav-height)) + var(--keyboard-inset,0px) + 8px);left:50%;transform:translateX(-50%);width:min(calc(100% - 24px),48rem);box-sizing:border-box;padding:10px 12px;border:1px solid var(--line,#dacac7);border-radius:16px;background:var(--white,#fffaf7);box-shadow:0 -6px 22px #51303924;display:grid;gap:8px;max-height:calc(100dvh - var(--visual-navigation-height,var(--nav-height)) - 40px);overflow:auto}
.fitting-primary p,.intake-primary p{margin:0;line-height:1.35}.fitting-primary>.button,.intake-primary>.button{width:100%;white-space:normal;font-size:inherit}
.app-main:has(.fitting-primary),.app-main:has(.intake-primary){padding-bottom:calc(var(--fitting-action-height,160px) + 24px)}
.fitting-garments{scroll-margin-block:16px}.fitting-garment :focus-visible{outline:3px solid var(--wine,#803b59);outline-offset:2px}
.intake-select .intake-preview{height:13rem;min-height:0;grid-template-rows:minmax(0,1fr)}
.intake-select .intake-preview img{width:100%;height:100%;max-height:100%;min-height:0;object-fit:contain}
.intake-choice,.fitting-picker-screen~.modal-backdrop .modal{max-height:calc(100dvh - 32px);overflow:auto;box-sizing:border-box}
.picker-heading h1,.app-main:has(.intake-preview) .screen-heading h1,.app-main:has(.wardrobe-grid) .screen-heading h1{overflow-wrap:normal;word-break:normal;hyphens:auto}
.fitting-picker-screen .shop-tabs{display:flex;flex-wrap:wrap}.fitting-picker-screen .shop-tabs .chip{flex:1 1 auto;overflow-wrap:normal;word-break:normal}
.fitting-picker-screen .filter-rail .chip{white-space:nowrap;overflow-wrap:normal}.fitting-picker-screen .filter-rail{max-width:100%;overflow:auto}
.batch-nav{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.batch-nav>.button{min-width:0;white-space:normal;flex:1 1 140px}.batch-nav-steps{margin-left:auto;display:flex}.batch-nav>.caption{white-space:nowrap}
[data-batch-screen] .screen-heading .button{white-space:normal}.fitting-picker-screen .fitting-choice strong{word-break:normal;overflow-wrap:break-word}
@media(min-width:720px){.fitting-primary,.intake-primary{left:calc(50% + 44px);width:min(calc(100% - 140px),48rem)}}
/* Navigation labels reflow together; enlarged words are not split mid-word. */
@media(max-width:719px){.bottom-nav{display:flex;flex-wrap:wrap;justify-content:space-around;gap:2px}.bottom-nav .nav-link{flex:1 1 3.4rem;min-width:0;max-width:100%;padding-inline:4px}.bottom-nav .nav-link>span:last-child{max-width:100%;white-space:normal;word-break:normal;overflow-wrap:anywhere;text-align:center}}
.app-main .screen-heading h1{overflow-wrap:normal;word-break:normal;hyphens:auto}
.fitting-picker-screen .shop-tabs{flex-wrap:nowrap;overflow-x:auto}.fitting-picker-screen .shop-tabs .chip{flex:0 0 auto;white-space:nowrap}
.fitting-picker-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr))}
.fitting-choice{grid-template-columns:minmax(0,1fr)}.fitting-choice>img,.fitting-choice>strong,.fitting-choice>span{min-width:0;max-width:100%}
/* Optional visual proposals, full-size text and controls on narrow screens. */
.visual-review{padding:1rem;border:1px solid var(--border,#e7dfe2);border-radius:1rem;min-width:0;overflow-wrap:anywhere}
.visual-feature{min-width:0;padding:.5rem 0;border-bottom:1px solid var(--border,#e7dfe2)}
.visual-check{display:flex;gap:.6rem;align-items:flex-start;min-height:44px;cursor:pointer}
.visual-check input{flex:none;margin-top:.25rem;width:1.1rem;height:1.1rem}
.visual-feature details summary{cursor:pointer;min-height:44px;padding:.5rem 0}
.visual-feature select{width:100%;max-width:100%}
.visual-review .button,.visual-review .quiet-link{white-space:normal;min-height:44px;text-align:left}
.visual-status{padding:.5rem;background:var(--surface,#fff8f2);border-radius:.5rem}

/* SHOP-PHOTO-UX-01. Карточка покупки: одно основное действие, остальное — на
   шаг глубже. Блок недоступного фото остаётся на месте фотографии и не
   разрастается в пустую полосу. Проверено на 320/390/430 px и тексте 200%. */
.shop-product .shop-primary{display:grid;gap:.5rem}
.shop-product .shop-primary>.button,.shop-product .shop-primary>a.button{width:100%;min-height:48px;white-space:normal}
.shop-more{border-top:1px solid var(--line,#ded8cf);padding-top:.5rem}
.shop-more>summary{min-height:44px;display:flex;align-items:center;cursor:pointer;color:var(--wine,#79425d);font-weight:600}
.shop-more .actions{display:grid;gap:.5rem;padding-top:.6rem}
.shop-more .actions>.button,.shop-more .actions>a.button{width:100%;min-height:44px;white-space:normal;text-align:left}
.shop-variant{display:grid;gap:.5rem}
.shop-variant>.button{min-height:44px}
.shop-variant select,.shop-variant input{width:100%;min-width:0}
.shop-mismatch{color:var(--wine,#7a4a2f)}
.product-preview.media-failed{min-height:8.25rem;display:grid;place-items:center;background:var(--sand,#f6f1eb);border-radius:.75rem;padding:.75rem}
.product-preview.media-failed .media-placeholder{width:100%;height:auto;min-height:4.5rem;border-radius:.75rem;padding:.75rem;font-size:.875rem;line-height:1.35}
.shop-product .image-recovery{display:grid;gap:.5rem;padding:.6rem 1rem 0;margin:0}
.shop-product .image-recovery>.button{width:100%;min-height:44px;white-space:normal}
.link-add{margin-bottom:1rem}
.link-add .button.full{width:100%;min-height:44px;white-space:normal;text-align:left;overflow-wrap:anywhere}
.link-add .shop-variant{margin-top:.5rem}
@media(min-width:26rem){.shop-more .actions{grid-template-columns:repeat(2,minmax(0,1fr))}}


/* MAX uses the same workspace, handlers and operation keys as the PWA. */
.max-quick {--bottom-nav-height:64px;}
.max-quick-header,.max-quick-nav {display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:16px;}
.max-quick-header a,.max-quick-nav a {min-height:44px;display:flex;align-items:center;overflow-wrap:anywhere;}
.max-quick-nav {position:fixed;bottom:var(--keyboard-inset,0px);left:0;right:0;width:100%;height:auto;min-height:64px;transform:none;background:var(--color-background,#f7f2ed);padding-bottom:max(12px,env(safe-area-inset-bottom));border-top:1px solid #ded6d0;z-index:30;}
.max-quick .app-main {padding-bottom:calc(var(--fitting-action-height,160px) + var(--visual-navigation-height,64px) + 28px);}
.max-quick .fitting-primary {left:50%;width:min(calc(100% - 24px),48rem);}
.max-quick .fitting-person {grid-template-columns:minmax(80px,110px) minmax(0,1fr);}
.max-quick .fitting-garments {margin:0;padding:0;}
.max-quick .fitting-garment {min-width:0;}
.max-quick h1 {overflow-wrap:anywhere;}
@media(max-width:360px){.max-quick .fitting-person {grid-template-columns:1fr;}}