.compactAdjustments .adjustments{padding:12px 16px 16px;margin:0;border-top:1px solid #dedede;background:#fff}
.adjustCaption{margin:0 0 10px;color:#666;font-size:14px;line-height:1.4}
.adjustTabs{display:flex;gap:4px;border-bottom:1px solid #ddd;margin-bottom:14px}
.adjustTabs button{flex:1;min-width:0;min-height:58px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;background:transparent;border:0;border-bottom:2px solid transparent;padding:6px 4px 9px;color:#666;font:inherit;font-size:14px;cursor:pointer}
.adjustTabs button svg{width:23px;height:23px}
.adjustTabs button[aria-selected=true]{color:#171717;border-bottom-color:#171717;background:#f4f4f2}
.adjustTabs button:focus-visible,.adjustPanel button:focus-visible,.compassDial:focus-visible{outline:2px solid #997638;outline-offset:2px}
.adjustPanel[hidden],.adjustTabs button[hidden]{display:none!important}
.adjustPanel{min-height:130px}
.adjustPanel .sizeRange{width:100%;min-height:44px;touch-action:pan-y;cursor:pointer}
.adjustPanel .dimensionFields{max-width:360px;margin-top:8px}
.adjustPanel .dimensionBox{min-height:44px}
.adjustPanel .artControlsHeading{gap:12px;flex-wrap:wrap}
.adjustPanel .artControlsHeading label{font-size:16px}
.adjustPanel .rotateBtn,.adjustPanel .textButton{min-height:44px}
.adjustPanel .sizeNote,.adjustHelp{font-size:14px;line-height:1.5;margin:8px 0;color:#666}
.adjustValue{display:flex;justify-content:space-between;align-items:center;gap:12px}
.adjustValue label,.brightnessHeading label{font-size:16px}
.adjustValue output{margin-left:8px;font-variant-numeric:tabular-nums}
.adjustPanel .frameOptions{display:flex;gap:8px;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x proximity}
.adjustPanel .frameChoice{flex:0 0 108px;min-height:86px;font-size:14px;scroll-snap-align:start}
.compactAdjustments #adjust-shadow .lightCompass{position:static;width:auto;max-width:220px;padding:0;margin:0 auto;border:0;box-shadow:none;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:0 18px;background:transparent}
.compactAdjustments #adjust-shadow .compassTitle{font-size:14px;width:100%;text-align:center}
.compactAdjustments #adjust-shadow .compassDial{width:100px;height:100px;flex:none}
.compactAdjustments #adjust-shadow .compassAuto{width:auto;min-height:44px;max-width:100px;font-size:14px;border:0;padding:6px}
.adjustLightOptions{margin-top:8px}
.adjustExplanation{margin:12px 0 0;font-size:14px;line-height:1.5;color:#666}
#adjust-shadow .adjustExplanation{text-align:center}
.quickPlanner .adjustExplanation{display:none}
.compactAdjustments:not(.quickPlanner) #brightnessHelp,
.compactAdjustments:not(.quickPlanner) #adjust-shadow>.adjustHelp,
.compactAdjustments:not(.quickPlanner) #adjust-wall #referenceHelp:not(.perspectiveHelp),
.compactAdjustments:not(.quickPlanner) #adjust-frame #frameNote{display:none}
.compactAdjustments:not(.quickPlanner) .adjustLightOptions{display:none!important}
.compactAdjustments #adjust-shadow .halfCompass .compassDial{width:200px;height:120px;border-radius:0}
.compactAdjustments #adjust-shadow .halfCompass .compassAuto{display:none!important}
.adjustLightOptions>label{font-size:14px;margin-right:8px}
.adjustLightOptions select{min-height:44px;font-size:16px;max-width:100%}
.adjustLightOptions #lightHint{font-size:14px;line-height:1.5;color:#666;margin:8px 0 0}
.compactAdjustments #designPanel>.tabs,.compactAdjustments #designPanel>#sizePanel,.compactAdjustments #designPanel>#framePanel,.compactAdjustments .lightControls,.compactAdjustments .compassDock{display:none!important}
.compactAdjustments:not(.quickPlanner) #picturePanel{display:block!important}
.compactAdjustments.quickPlanner #adjust-size .dimensionFields,.compactAdjustments.quickPlanner #adjust-size #sizeLimit{display:none}
.compactAdjustments .multiArtworkControls{margin-bottom:12px}
.compactAdjustments:not(.quickPlanner) .multiArtworkControls{display:none!important}
.compactAdjustments:not(.quickPlanner) .adjustments{padding-top:0}
.compactAdjustments .brightnessControl{margin:0;padding:0;border:0}
.compactAdjustments:not(.quickPlanner) #referenceSummary{display:none!important}
.compactAdjustments:not(.quickPlanner) body[data-flow-step="2"] #artControls{display:block!important}
.compactAdjustments:not(.quickPlanner) body[data-flow-step="2"] .multiArtworkControls{display:none!important}
.compactAdjustments:not(.quickPlanner) body[data-flow-step="2"] .flowHeading{display:none}
#adjust-wall .calibration{margin:0;padding:0;border:0}
#adjust-wall .measureHeading{margin-top:12px}
#adjust-wall .referenceInput{max-width:380px}
#adjust-wall #applyReference{max-width:380px}
@media(min-width:851px){.compactAdjustments:not(.quickPlanner) .side>#adjust-wall{padding:0;min-height:0}.compactAdjustments:not(.quickPlanner) .side>#adjust-wall #wallMode{width:100%;margin-top:8px}.compactAdjustments:not(.quickPlanner) .side>#adjust-wall .referenceInput{max-width:none}.compactAdjustments:not(.quickPlanner) .side>#adjust-wall #applyReference{max-width:none}}
.adjustPhotoChange{display:inline-flex;align-items:center;min-height:44px;font-size:14px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.adjustTabs{overflow-x:auto}.adjustTabs button{min-width:46px;flex-shrink:0}
.compactAdjustments:not(.quickPlanner) .plannerSearch,
.compactAdjustments:not(.quickPlanner) #gallery,
.compactAdjustments:not(.quickPlanner) #plannerNoResults,
.compactAdjustments:not(.quickPlanner) .workSummary,
.compactAdjustments:not(.quickPlanner) #adjust-size .dimensionFields,
.compactAdjustments:not(.quickPlanner) #adjust-size #sizeLimit{display:none!important}
.sizeReadout{flex:1;min-width:0}
.compactAdjustments:not(.quickPlanner) .artControlsHeading .sizeReadout label{white-space:normal;flex-wrap:wrap}
.compactAdjustments:not(.quickPlanner) .sizeReadout #outerSize{margin:5px 0 0;font-size:14px;line-height:1.45;color:#666;font-variant-numeric:tabular-nums}
@media(max-width:600px){.compactAdjustments .adjustments{padding:10px 12px 12px}.adjustTabs{gap:0}.adjustTabs button{font-size:14px}.adjustPanel{min-height:120px}.adjustValue{gap:6px}.adjustPanel .frameChoice{flex-basis:100px}.adjustPanel input[type=number]{font-size:16px}.compactAdjustments #adjust-shadow .compassDial{width:108px;height:108px}}

#adjust-shadow .lightCompass{margin-bottom:12px}.shadowSpreadControl{margin-top:12px}

.pictureChoice{display:flex;align-items:center;gap:16px;margin-bottom:12px}.chosenPicture{width:100px;height:90px;object-fit:contain;background:#f5f5f5}.chosenPicture[hidden]{display:none}.chosenPictureLabel{font-size:14px;margin:0 0 8px}.pictureChoice .plainBtn,#adjust-picture>#browseBtn{min-height:44px}#adjust-picture>#browseBtn{width:100%}

.saturationControl{margin-top:16px}
/* Compact controls: keep labels and values, omit repeated endpoint captions. */
.compactAdjustments .adjustPanel .brightnessLabels{display:none}
.compactAdjustments .adjustPanel{min-height:0}
.compactAdjustments .adjustTabs{margin-bottom:8px}
.compactAdjustments .adjustPanel .sizeRange{height:44px;min-height:44px;margin:0}
.compactAdjustments .adjustValue,.compactAdjustments .brightnessHeading{min-height:36px}
.compactAdjustments .adjustPanel .textButton{min-height:36px;padding-block:4px}
.compactAdjustments .saturationControl,.compactAdjustments .shadowSpreadControl{margin-top:4px}
.compactAdjustments .adjustExplanation{margin-top:6px;line-height:1.4}
.compactAdjustments #adjust-shadow .lightCompass{margin-bottom:4px}
.compactAdjustments #adjust-shadow .halfCompass .compassDial{width:160px;height:96px}
@media(pointer:coarse){.compactAdjustments .adjustPanel .textButton{min-height:44px}}

.pictureChoice>div{min-width:0;flex:1}.pictureChoice .pictureRotate{flex:none;margin-left:auto;min-height:44px}.chosenPictureLabel{overflow-wrap:anywhere}

.compactAdjustments #adjust-shadow:not([hidden]){display:grid;grid-template-columns:160px minmax(0,1fr);gap:4px 16px;align-items:center}.compactAdjustments #adjust-shadow .lightCompass{grid-column:1;margin:0!important}.shadowSliders{grid-column:2;min-width:0}.compactAdjustments #adjust-shadow>.adjustExplanation{grid-column:1/-1;text-align:left;margin-top:0}.shadowSliders .adjustHelp{display:none}.shadowSliders .adjustValue label{font-size:14px}.shadowSliders .adjustValue output{margin-left:4px}.shadowSliders .adjustValue{min-height:28px}.shadowSliders .textButton{font-size:14px}.compactAdjustments #adjust-shadow .shadowSliders .sizeRange{height:40px;min-height:40px}.shadowLengthControl,.shadowSliders .shadowSpreadControl{margin:0}
@media(max-width:480px){.compactAdjustments #adjust-shadow:not([hidden]){grid-template-columns:104px minmax(0,1fr);column-gap:10px}.compactAdjustments #adjust-shadow .halfCompass .compassDial{width:104px;height:62.4px}.shadowSliders .adjustValue{flex-wrap:wrap;gap:0 4px}.shadowSliders .adjustValue label{font-size:14px}.shadowSliders #resetShadow{min-height:28px;padding:0 2px}}

.multiPicker,.compactSlots,.multiActions,.layoutRow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.multiPicker{margin-bottom:10px}.compactSlots{margin-right:auto;gap:5px}.multiPicker button,.multiSize button{min-height:44px;padding:7px 12px;border:1px solid #bbb;background:#fff;color:#222;font-size:14px;cursor:pointer}.multiPicker button[aria-pressed=true],.multiSize button[aria-pressed=true]{background:#e9e9e9}.multiPicker button:hover,.multiSize button:hover{background:#f1f1f1}.multiPicker button:disabled{opacity:.4;cursor:default}.multiSize{margin-top:10px;border-top:1px solid #ddd;padding-top:8px}.multiSize[hidden],.multiPicker[hidden],.multiSize tr[hidden],.compactSlots button[hidden]{display:none}.multiSize table{width:100%;border-collapse:collapse;font-size:14px}.multiSize th{text-align:left;font-weight:400;padding:3px}.multiSize td{padding:3px}.multiSize td input{width:100%;box-sizing:border-box;min-width:0}.multiSize input[type=number],.multiSize select{min-height:44px;border:1px solid #bbb;background:#fff;color:#222;font-size:16px;padding:6px 8px;border-radius:0}.multiSize table{table-layout:fixed}.multiSize th:first-child{width:44px}.multiActions{margin:6px 0}.multiActions label{display:flex;align-items:center;gap:6px;font-size:14px;min-height:44px}.multiActions input{width:18px;height:18px}.layoutRow{align-items:flex-end}.layoutRow label{display:flex;flex-direction:column;gap:4px;font-size:14px;flex:1;min-width:100px}.layoutRow input{width:100%;box-sizing:border-box}.multiNote{font-size:12px;color:#666;margin:6px 0 0}.multiPicker button:focus-visible,.multiSize button:focus-visible{outline:2px solid #777;outline-offset:2px}

.multiSize .deleteColumn{width:44px;padding:3px 0 3px 3px}.multiSize .deleteArtwork{display:inline-flex;align-items:center;justify-content:center;width:44px;min-height:44px;padding:0;border-color:transparent;background:transparent;color:#666}.multiSize .deleteArtwork:hover{background:#eee;color:#222}.multiSize .deleteArtwork:disabled{opacity:.35;cursor:default}

.sideAdjustments[hidden]{display:none!important}
.sideAdjustments{min-width:0;margin:0;padding:0}
.sideAdjustTitle{font-family:inherit;font-size:18px;font-weight:700;line-height:1.35;color:#171717;margin:0 0 10px}
.sideAdjustments .adjustCaption{margin:0 0 8px;font-size:13px}
@media(min-width:851px){
 .compactAdjustments:not(.quickPlanner) body[data-flow-step="3"] .flowHeading #flowHelp{font-size:14px;line-height:1.45;margin-bottom:12px}
 .sideAdjustments .adjustPanel{min-width:0}
 .sideAdjustments .frameOptions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;overflow:visible}
 .sideAdjustments .frameChoice{min-width:0;min-height:76px}
 .sideAdjustments .pictureChoice{gap:8px}
 .sideAdjustments .chosenPicture{width:72px;height:72px}
 .sideAdjustments .artControlsHeading{gap:6px}
 .sideAdjustments .multiSize th{font-size:12px;overflow-wrap:anywhere}
 .sideAdjustments .multiSize td input{padding-inline:4px}
 .compactAdjustments .sideAdjustments #adjust-shadow:not([hidden]){grid-template-columns:104px minmax(0,1fr);column-gap:8px}
 .compactAdjustments .sideAdjustments #adjust-shadow .halfCompass .compassDial{width:104px;height:62.4px}
 .sideAdjustments .shadowSliders .adjustValue{flex-wrap:wrap;gap:0 4px}
 .sideAdjustments .shadowSliders #resetShadow{min-height:28px;padding:0 2px}
}

.compactAdjustments #adjust-wall #measureTitle{font-family:inherit;font-size:18px;font-weight:700;line-height:1.35;color:#171717}

/* Shared slider appearance in both the side panel and the mobile panel. */
.compactAdjustments .adjustPanel .sizeRange{appearance:none;-webkit-appearance:none;display:block;width:100%;height:44px;min-height:44px;margin:0;padding:0;border:0;background:transparent;accent-color:#171717}
.compactAdjustments .adjustPanel .sizeRange::-webkit-slider-runnable-track{height:4px;border-radius:3px;background:linear-gradient(to right,#171717 var(--range-progress,0%),#c9c9c9 var(--range-progress,0%))}
.compactAdjustments .adjustPanel .sizeRange::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:20px;height:20px;margin-top:-8px;border:2px solid #fff;border-radius:50%;background:#171717;box-shadow:0 0 0 1px #999}
.compactAdjustments .adjustPanel .sizeRange::-moz-range-track{height:4px;border:0;border-radius:3px;background:linear-gradient(to right,#171717 var(--range-progress,0%),#c9c9c9 var(--range-progress,0%))}
.compactAdjustments .adjustPanel .sizeRange::-moz-range-thumb{width:20px;height:20px;box-sizing:border-box;border:2px solid #fff;border-radius:50%;background:#171717;box-shadow:0 0 0 1px #999}
.compactAdjustments .adjustPanel .brightnessHeading output{font-weight:400;margin-left:8px}
.compactAdjustments:not(.quickPlanner) #artControls.adjustments{padding-top:10px;padding-bottom:10px}
.compactAdjustments .adjustTabs{gap:6px;margin-bottom:0;border-bottom:0}
.compactAdjustments .adjustTabs button{flex:0 1 76px;min-width:44px;min-height:48px;padding:5px 6px;gap:3px;font-size:12px}
.compactAdjustments .adjustTabs button svg{width:19px;height:19px}
.compactAdjustments #adjust-shadow .lightCompass .compassDial{width:104px;height:104px;border-radius:50%}
.compactAdjustments #adjust-shadow .compassAuto{display:none!important}
@media(max-width:850px){.compactAdjustments .adjustTabs{margin-bottom:8px}.compactAdjustments .adjustTabs button{flex:1}}

.compactAdjustments #adjust-shadow .lightCompass{align-self:start;transform:translateY(var(--compass-align-y,0px))}

.compactAdjustments .adjustments .adjustTabs{gap:6px}
.compactAdjustments .adjustTabs button{white-space:nowrap}
#adjust-multiple>.plainBtn{width:100%;min-height:44px}
#adjust-multiple .arrangementControls{margin-top:8px}
@media(max-width:600px){.compactAdjustments .adjustTabs button{flex:0 0 62px}.compactAdjustments .adjustments .adjustTabs{gap:4px}}

/* Compact numeric rows: keep labels readable without stretching short values. */
.compactAdjustments #adjust-size .multiSize{margin-top:4px;padding-top:4px}
.compactAdjustments #adjust-size .multiSize table{width:256px;max-width:100%;table-layout:fixed}
.compactAdjustments #adjust-size .multiSize th:first-child{width:36px}
.compactAdjustments #adjust-size .multiSize .deleteColumn{width:36px}
.compactAdjustments #adjust-size .multiSize th,.compactAdjustments #adjust-size .multiSize td{padding:2px 3px;font-size:12px}
.compactAdjustments #adjust-size .multiSize input[type=number]{font-size:14px;padding:4px 5px;text-align:right;font-variant-numeric:tabular-nums}
.compactAdjustments #adjust-size .multiSize .deleteArtwork{width:32px;padding:0}
.customSizeHelp summary{cursor:pointer;min-height:28px;display:list-item;padding:4px 0}
.customSizeHelp p{margin:4px 0 0}
.sideAdjustments .sideAdjustTitle{margin-bottom:6px}
.sideAdjustments .adjustCaption{margin-bottom:4px}
.sideAdjustments .pictureChoice{margin-bottom:6px}
.sideAdjustments .chosenPictureLabel{margin-bottom:4px}
.sideAdjustments .multiPicker{margin-bottom:6px;gap:6px}
.sideAdjustments .multiActions{margin:4px 0;gap:6px}
.sideAdjustments .layoutRow{gap:6px}
.sideAdjustments .layoutRow label{min-width:0}
.sideAdjustments .layoutRow label:first-child{flex:1 1 120px}
.sideAdjustments .layoutRow label:nth-child(2){flex:0 0 76px}
.sideAdjustments .layoutRow>button{padding-inline:8px}
.sideAdjustments .adjustExplanation{margin:4px 0 0;line-height:1.4}
.sideAdjustments .customSizeHelp{margin-top:4px}
.guidedPlanner body[data-flow-step="3"] .flowActions{margin-top:8px;padding-top:8px;gap:8px}
@media(pointer:fine){
 .compactAdjustments .sideAdjustments .adjustPanel .sizeRange{height:32px;min-height:32px}
 .compactAdjustments .sideAdjustments :is(.adjustValue,.brightnessHeading){min-height:28px}
 .compactAdjustments .sideAdjustments .adjustPanel .textButton{min-height:28px;padding-block:2px}
 .compactAdjustments .sideAdjustments :is(.multiPicker button,.multiSize button,.multiSize input[type=number],.multiSize select,.multiActions label){min-height:32px}
 .compactAdjustments .sideAdjustments .multiSize button{padding-block:4px}
 .compactAdjustments .sideAdjustments .frameChoice{min-height:64px;padding:6px}
 .compactAdjustments .sideAdjustments :is(.rotateBtn,.pictureRotate){min-height:32px}
}
@media(pointer:coarse){.compactAdjustments #adjust-size .multiSize input[type=number]{font-size:16px;min-height:44px}}

/* Compact artwork identification in both multi-image editors. */
.compactAdjustments .artworkBadge{display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:4px 6px;min-width:48px}
.compactAdjustments .artworkBadge img{width:24px;height:24px;object-fit:contain;flex-shrink:0}
.compactAdjustments #adjust-size .multiSize th:first-child{width:58px}
.compactAdjustments #adjust-size .multiSize table{width:278px;max-width:100%}
.compactAdjustments .multiActions button:disabled{opacity:.45;cursor:default}

.compactAdjustments .layoutRow label:first-child{flex:0 0 144px;min-width:0;width:144px}
.compactAdjustments .layoutRow select,.compactAdjustments .multiActions .equalSizeButton{width:144px;max-width:100%;box-sizing:border-box;font-size:14px;min-height:44px;padding:6px 8px}
@media(pointer:fine){.compactAdjustments .layoutRow select,.compactAdjustments .multiActions .equalSizeButton{height:32px;min-height:32px;padding-block:4px}}

.compactAdjustments .sizeGapRow{display:flex;align-items:center;gap:6px;margin-top:4px;flex-wrap:wrap}
.compactAdjustments .sizeGapRow label{display:flex;align-items:center;gap:6px;font-size:14px;margin:0}
.compactAdjustments .sizeGapRow input{width:76px;min-width:0;box-sizing:border-box}

.compactAdjustments #adjust-size .sizeTogetherControl{display:flex;flex-direction:column;align-items:flex-start;gap:0;margin:2px 0 6px}
.compactAdjustments #adjust-size .sizeTogetherControl label{margin:0;min-height:28px}
.compactAdjustments #adjust-size .sizeTogetherControl .multiNote{margin:0;line-height:1.3}
@media(pointer:coarse){.compactAdjustments #adjust-size .sizeTogetherControl label{min-height:44px}}

.compactAdjustments #centerBtn{display:none!important}
.compactAdjustments .layoutRow .gapWithUnit{display:flex;align-items:center;gap:4px;white-space:nowrap}
.compactAdjustments .layoutRow .gapWithUnit input{width:76px;min-width:76px;flex:0 0 76px;padding-inline:6px}
.compactAdjustments .layoutRow .gapWithUnit>span{font-size:14px}

.compactAdjustments .layoutChoices{display:flex;flex-direction:column;gap:4px;font-size:14px}
.compactAdjustments .layoutChoiceButtons{display:flex;gap:5px}
.compactAdjustments .layoutChoiceButtons button{padding-inline:8px;white-space:nowrap}
.compactAdjustments .layoutChoiceButtons button[aria-pressed=true]{background:#e9e9e9;border-color:#aaa}
.compactAdjustments .layoutChoiceButtons button:disabled{opacity:.45;cursor:default}
.compactAdjustments .layoutRow>label{flex:0 0 102px;min-width:102px}