.modal.studio-modal{max-width:1060px;width:min(1060px,calc(100vw - 36px))}.modal.recolor-modal{max-width:1240px;width:min(1240px,calc(100vw - 36px))}.studio-modal .modal-body{padding:0}.recolor-studio{display:grid;grid-template-columns:minmax(0,1fr) 306px;min-height:540px;max-height:calc(100vh - 210px)}.recolor-preview-area{background:#141718;display:flex;flex-direction:column;min-width:0;padding:18px 22px}.recolor-preview-toolbar,.recolor-preview-footer{display:flex;justify-content:space-between;align-items:center;gap:12px}.studio-eyebrow{font-size:10px;text-transform:uppercase;letter-spacing:.15em;color:#a0ada8}.recolor-preview-toolbar .subtle-button{display:flex;align-items:center;gap:8px}.recolor-preview-toolbar svg{width:15px;height:15px}.recolor-preview-toolbar .active{color:var(--accent,#d6ed7b)}.comparison-stage{position:relative;flex:1;min-height:220px;display:flex;align-items:center;justify-content:center;margin:18px 0;overflow:hidden;background-color:#202425;background-image:linear-gradient(45deg,#2a2e2f 25%,transparent 25%),linear-gradient(-45deg,#2a2e2f 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#2a2e2f 75%),linear-gradient(-45deg,transparent 75%,#2a2e2f 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0;border:1px solid #353b3c;border-radius:6px}.comparison-stage canvas{display:block;max-width:100%;max-height:calc(100vh - 370px);width:auto;height:auto;object-fit:contain}.comparison-label{position:absolute;top:11px;padding:4px 9px;border-radius:5px;background:#111a;color:#fff;font-size:10px;pointer-events:none}.comparison-label.before{left:12px}.comparison-label.after{right:12px}.comparison-divider{position:absolute;top:0;bottom:0;width:1px;background:#eef6e8;pointer-events:none;box-shadow:0 0 2px #0008}.comparison-divider span{position:absolute;left:-18px;top:50%;transform:translateY(-50%);width:37px;height:30px;border-radius:20px;background:#eaf1e5;color:#202722;font-size:18px;font-weight:600;display:grid;place-items:center;box-shadow:0 2px 12px #0006}.comparison-control{display:flex;align-items:center;gap:16px;color:#b4c0b9;font-size:11px}.comparison-control input{flex:1;accent-color:#d6ed7b;min-width:50px}.recolor-preview-footer{font-size:10px;color:#808e88;margin-top:13px;min-height:22px}.recolor-preview-footer span:last-child{white-space:nowrap}.recolor-controls{overflow:auto;padding:20px;background:#222628;border-left:1px solid #383e3f;display:flex;flex-direction:column;gap:17px}.recolor-controls .form-label{margin:0}.studio-segments{display:flex;border:1px solid #3d4443;border-radius:7px;padding:3px;background:#191d1e;gap:3px}.studio-segments button{flex:1;font-size:11px;line-height:1.2;padding:9px 5px;background:transparent;border:0;border-radius:4px;color:#9daaa4}.studio-segments button.active{background:#3b4540;color:#eef6e9;box-shadow:0 1px 3px #0003}.studio-segments button:disabled{opacity:.35}.reference-drop{display:flex;align-items:center;gap:10px;text-align:left;border:1px dashed #56635b;border-radius:8px;background:#2b312e;padding:12px;color:#dce6df;min-height:70px}.reference-drop>span:first-child{width:35px;height:40px;flex-shrink:0;display:grid;place-items:center;color:#b7c79a;background:#454d3d;border-radius:5px;overflow:hidden}.reference-drop>span:first-child svg{width:20px;height:20px}.reference-drop img{width:100%;height:100%;object-fit:cover}.reference-drop>span:nth-child(2){flex:1;min-width:0}.reference-drop strong{display:block;font-size:12px}.reference-drop small{display:block;font-size:10px;color:#98a69d;line-height:1.6;margin-top:3px;overflow:hidden;text-overflow:ellipsis}.reference-drop>svg{width:14px;height:14px}.reference-swatches{display:flex;gap:6px;flex-wrap:wrap}.reference-swatches:empty{display:none}.reference-swatches button{width:25px;height:25px;border-radius:50%;border:2px solid #e6eade;box-shadow:0 0 0 1px #626d63}.palette-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px;color:#9aa89e;font-size:10px}.palette-heading label{display:flex;align-items:center;gap:6px}.palette-heading select{background:#171c19;border:1px solid #465148;color:#c8d7cd;border-radius:4px;padding:3px}.recolor-mappings{display:flex;flex-direction:column;gap:5px}.palette-mapping{display:grid;grid-template-columns:78px 16px minmax(0,1fr);align-items:center;gap:9px;border:1px solid transparent;border-radius:7px;padding:4px}.palette-mapping.active{border-color:#94a969;background:#343f30}.palette-source{display:flex;align-items:center;gap:6px}.palette-source input{width:11px;height:11px;accent-color:#cbdba7}.palette-source span{height:25px;width:25px;border-radius:5px;box-shadow:inset 0 0 0 1px #ffffff20}.palette-source small{color:#a1aea4;font-size:10px}.map-arrow{color:#829180}.palette-mapping>input[type=color]{width:100%;height:29px;padding:0;border:0;background:transparent;cursor:pointer}.palette-mapping>input::-webkit-color-swatch-wrapper{padding:0}.palette-mapping>input::-webkit-color-swatch{border:1px solid #ffffff20;border-radius:5px}.studio-slider{display:flex;flex-direction:column;gap:8px;font-size:11px;color:#c4cec7}.studio-slider>span{display:flex;justify-content:space-between;gap:8px}.studio-slider output{color:#8fa97e;font-variant-numeric:tabular-nums}.studio-slider input{accent-color:#c7dda2;width:100%;margin:0;height:14px}.single-colors{display:flex;gap:15px;align-items:center;justify-content:space-between;margin-bottom:18px}.single-colors label{font-size:11px;color:#a7b5ab;display:flex;flex-direction:column;gap:8px;flex:1}.single-colors input{width:100%;height:44px;border:0;padding:0;background:none}.single-colors+label{margin-bottom:16px}.symmetry-studio{display:grid;grid-template-columns:1fr 1fr;gap:30px;padding:28px}.symmetry-preview{background:#19201e;border:1px solid #3c4941;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:14px;min-width:0}.symmetry-preview svg{width:100%;max-width:340px}.symmetry-preview>span{font-size:12px;color:#a5b79f;margin:8px}.symmetry-settings{display:flex;flex-direction:column;gap:18px;justify-content:center}.symmetry-settings .form-label{margin:0}.symmetry-settings .form-row{gap:12px}.symmetry-tool-action svg{width:15px;height:15px}.range-studio{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:28px;padding:24px}.range-preview{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:#131617;border:1px solid #3c4540;padding:14px;border-radius:6px;min-height:300px}.range-preview canvas{display:block;max-width:100%;max-height:450px;object-fit:contain}.range-preview span{font-size:11px;color:#99a69c}.range-controls{display:flex;flex-direction:column;gap:18px}.range-samples{display:flex;flex-wrap:wrap;gap:8px}.range-samples label{display:flex;align-items:center}.range-samples input{width:38px;height:32px;border:0;background:none;padding:0}.range-samples button{background:transparent;border:0;color:#a9b8ac;font-size:18px}.range-samples button:disabled{visibility:hidden}.studio-modal input:focus-visible,.studio-modal button:focus-visible,.studio-modal select:focus-visible{outline:2px solid #d6ed7b;outline-offset:3px}.studio-modal [hidden]{display:none!important}
@media(max-width:800px){.recolor-studio{grid-template-columns:1fr;max-height:none;min-height:0}.recolor-preview-area{min-height:330px;padding:14px}.comparison-stage{min-height:220px;margin:12px 0}.comparison-stage canvas{max-height:340px}.recolor-controls{border-left:0;border-top:1px solid #39443d;overflow:visible}.recolor-preview-footer span:last-child{display:none}.symmetry-studio{grid-template-columns:1fr;padding:18px;gap:20px}.symmetry-preview{max-height:240px}.symmetry-preview svg{max-height:200px}.range-studio{grid-template-columns:1fr;padding:16px}.range-preview{min-height:180px}.range-preview canvas{max-height:240px}.modal.studio-modal{width:calc(100vw - 20px)}.studio-modal .form-row{grid-template-columns:1fr 1fr}}

.header-studio-button{font-family:inherit;font-size:11px;background:transparent;color:#b6c6ba;border:1px solid #434d45;border-radius:5px;padding:7px 10px;white-space:nowrap}.header-studio-button:hover{background:#333e34;color:#e2eedc}.ai-header-button{color:#c3bcdb;border-color:#544e62;margin-right:6px}@media(max-width:1120px){.local-badge{display:none!important}.header-studio-button{font-size:10px;padding:6px 8px}}@media(max-width:790px){#recolor-open{display:none}.ai-header-button{font-size:10px;padding:6px}.menubar .brand{margin-right:3px}}

.color-sample-readout{display:flex;align-items:center;gap:6px;white-space:nowrap;font-size:10px;color:#d4dfd7}.color-sample-readout i{width:16px;height:16px;border-radius:3px;border:1px solid #ffffff30}.color-sample-readout small{font-size:9px;color:#8c9c90}.note-list-item{display:flex;flex-direction:column;gap:8px;padding:15px;width:100%;text-align:left;border:1px solid #ffffff15;border-radius:6px;background:#ffffff04;color:#cbd7ce;margin:8px 0}.note-list-item strong{font-size:10px;color:#bacd96}.note-list-item span{white-space:pre-wrap;font-size:12px;line-height:1.7}

.recolor-studio{height:min(720px,calc(100vh - 218px));min-height:0;grid-template-rows:minmax(0,1fr)}.recolor-preview-area,.recolor-controls{min-height:0}.comparison-stage{min-height:0}.comparison-stage canvas{position:absolute;max-height:100%;max-width:100%}.recolor-preview-toolbar,.comparison-control,.recolor-preview-footer{flex-shrink:0}.pro-tool-card[hidden],.pro-tool-section[hidden]{display:none!important}
@media(max-width:800px){.recolor-studio{height:auto;grid-template-rows:auto}.comparison-stage{height:300px;min-height:220px;flex:none}.recolor-preview-area{min-height:0}}

.palette-target{display:flex;align-items:center;min-width:0;gap:6px;background:#141b17;border:1px solid #ffffff20;border-radius:5px;padding:3px}.palette-target>input[type=color]{flex:1;min-width:24px;width:24px;height:24px;border:0;padding:0;background:none;cursor:pointer}.palette-target>input[type=color]::-webkit-color-swatch-wrapper{padding:0}.palette-target>input[type=color]::-webkit-color-swatch{border:0;border-radius:2px}.palette-target>input[type=text]{min-width:0;width:64px;color:#c5d1c7;background:transparent;border:0;font:10px ui-monospace,monospace;padding:2px}.palette-target>input[aria-invalid=true]{color:#ef9696}

.composition-preview{min-height:200px;display:flex;align-items:center;justify-content:center;background:#151a18;border:1px solid #3b4940;border-radius:8px;margin-bottom:20px;padding:16px}.composition-preview canvas{max-width:100%;max-height:50vh;object-fit:contain}.composition-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.composition-list{display:flex;flex-direction:column;gap:8px}.composition-item{display:flex;align-items:center;gap:12px;background:#ffffff04;border:1px solid #ffffff12;border-radius:7px;padding:14px}.composition-item>span:nth-child(2){flex:1;min-width:100px}.composition-item strong,.composition-item small{display:block}.composition-item small{color:#9aa89f;font-size:11px;margin-top:6px}.composition-index{display:grid;place-items:center;border-radius:5px;width:28px;height:28px;color:#d6ed7b;background:#d6ed7b18;font-size:11px}@media(max-width:650px){.composition-item{flex-wrap:wrap}.composition-item>span:nth-child(2){flex-basis:75%}.composition-item button{flex:1}.composition-fields{gap:10px}}

.symmetry-settings [hidden]{display:none!important}.symmetry-settings{max-height:min(600px,calc(100vh - 240px));overflow:auto}.symmetry-settings #symmetry-warning{color:#eebba1}.fill-studio{display:grid;gap:14px}.fill-studio .comparison-stage{height:min(480px,50vh);min-height:200px}.fill-studio .form-row{align-items:end}.fill-studio canvas{max-height:100%;max-width:100%;object-fit:contain}
