:root{font-family:Arial,Helvetica,sans-serif;color:#26333a;background:#f5f2ed;--green:#31513e;--sage:#668876;--sand:#cbb99a;--border:#e4e1da}
*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:3px solid #89aa90;outline-offset:2px}
.page{max-width:1860px;margin:auto;padding:18px 22px 40px}.top{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap;margin-bottom:16px}.top h1{font-size:25px;line-height:1.2;margin:0 0 6px;letter-spacing:-.5px}.sub{margin:0;color:#66757b;font-size:13px}.brand{font-size:11px;letter-spacing:1.2px;font-weight:700;border:1px solid #cdbda3;color:#876d4c;border-radius:7px;padding:10px 12px;white-space:nowrap}
.workspace{display:grid;grid-template-columns:minmax(235px,260px) minmax(0,1fr) minmax(255px,290px);align-items:start;gap:14px}.panel{background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 5px 18px #24261e08;min-width:0}.imports,.controls{padding:17px}.controls{position:sticky;top:12px;max-height:calc(100vh - 24px);overflow:auto;scrollbar-width:thin}.stage{padding:17px}.block{padding:0 0 17px;margin:0 0 17px;border-bottom:1px solid #ebe8e1}.block:last-child{border:0;margin:0;padding:0}.heading{font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:1px;color:#836e50;margin:0 0 13px}.upload{display:block;padding:14px 10px;border:1px dashed #c6b79d;background:#fbf9f5;border-radius:9px;font-size:12.5px;text-align:center;color:#544637;font-weight:700;cursor:pointer}.upload:hover{background:#f6f0e4}.upload input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}.file{font-size:11.5px;margin:8px 0 0;color:#50695c;overflow-wrap:anywhere}.hint{font-size:11.5px;color:#748086;line-height:1.4;margin:7px 0 0}.patterns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:11px 0 12px}.pattern{background:#f8f8f7;border:2px solid #e5e5e2;border-radius:9px;padding:6px;min-width:0;font-size:11px;color:#404849;text-align:center}.pattern.selected{border-color:var(--sage);background:#eff6f1}.pattern canvas{width:100%;height:43px;display:block}.checkrow{display:flex;align-items:flex-start;gap:8px;font-size:12px;line-height:1.35;color:#394446;cursor:pointer}.checkrow input{margin:2px 0 0;accent-color:var(--green);flex:none}.minor{font-size:11.5px;color:#728087;line-height:1.4}.btn{border:1px solid #d9dbd7;border-radius:8px;padding:9px 11px;background:#fff;color:#354448;font-weight:700;font-size:12px}.btn:hover{background:#f4f5f1}.btn.dark{background:var(--green);border-color:var(--green);color:#fff}.btn.dark:hover{background:#24402f}.btn.full{width:100%}.rowbuttons{display:flex;flex-wrap:wrap;gap:7px}.stagehead{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:13px}.stagehead h2{font-size:18px;margin:0 0 4px}.stagehead p{font-size:12px;color:#7a8487;margin:0}.preview{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:11px;align-items:start}.frame{background:#efede8;border:1px solid var(--border);border-radius:10px;overflow:hidden;min-width:0}.framehead{font-size:12px;padding:10px 12px;background:#fff;font-weight:700;border-bottom:1px solid var(--border)}.framehead .muted{font-weight:normal;color:#798185}.frame canvas{display:block;width:100%;height:auto;max-width:100%;background:#eeece6}.frame.editable canvas{touch-action:none;cursor:move}.caption{margin:12px 0 0;padding:10px 11px;border-radius:8px;background:#f7f6f2;color:#657179;font-size:11.5px;line-height:1.4}.status{min-height:18px;color:#42654a;margin-top:8px;font-size:11.5px}
.segment{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;background:#f1f3f0;border-radius:9px;margin-bottom:10px}.segment button{font-size:12px;padding:10px 6px;border:0;background:transparent;border-radius:7px;font-weight:700;color:#53605a}.segment button.selected{background:var(--green);color:#fff;box-shadow:0 1px 4px #0001}.guide{margin:0 0 13px;color:#52605e;font-size:12px;line-height:1.5;background:#f7f8f5;border:1px solid #e7eee8;border-radius:8px;padding:10px}.guide strong{color:#2c4d3a}.controlTitle{font-size:12px;font-weight:800;color:#43504b;margin:0 0 10px}.palette{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px;margin-bottom:10px}.swatch{border:1px solid #aaa;background:#fff;width:100%;aspect-ratio:1;border-radius:7px;padding:0}.swatch.active{outline:3px solid #6e9a7a;outline-offset:2px}.colorLine{display:flex;gap:9px;align-items:center;margin:0}.colorLine input[type=color]{height:34px;width:46px;padding:2px;border:1px solid #d4d4cd;border-radius:7px;background:#fff;cursor:pointer}.colorLine span{font-size:12px;line-height:1.25}.controlSection{border-top:1px solid #ebe8e1;margin-top:14px;padding-top:14px}.slider{margin:9px 0 10px}.sliderTop{display:flex;justify-content:space-between;align-items:center;gap:9px;font-size:11.5px;font-weight:600;color:#475552}.sliderTop output{font-weight:700;color:#375a44;font-variant-numeric:tabular-nums}.slider input[type=range]{width:100%;margin:7px 0 0;accent-color:#5c8168;cursor:pointer}.toggleline{display:flex;align-items:center;gap:8px;font-size:12px;margin:10px 0;cursor:pointer}.toggleline input{accent-color:var(--green)}.contextRow{display:flex;justify-content:space-between;align-items:center;gap:6px}.smallpill{font-size:10.5px;color:#53695b;background:#e8f1e8;border-radius:99px;padding:3px 7px;font-weight:bold}.notice{font-size:11.5px;line-height:1.45;color:#68777b;margin:8px 0 0}.hide{display:none!important}.btn.verified{background:#e9f3e9;border-color:#8bad93;color:#28543a}.stage.locked .editable canvas{cursor:default;touch-action:auto}.stage.locked .framehead .muted{color:#316948}.mask-tools{padding:10px 9px;background:#f7f8f5;border:1px solid #e8ece7;border-radius:9px;margin:11px 0}.mask-tools .slider{margin:6px 0 11px}.mask-tools .slider:last-of-type{margin-bottom:3px}.frame.editable canvas:focus-visible{outline:3px solid #7c9d87;outline-offset:-3px}
@media(max-width:1190px){.page{padding:14px}.workspace{grid-template-columns:220px minmax(0,1fr) 242px;gap:10px}.imports,.controls,.stage{padding:13px}.stagehead h2{font-size:16px}.preview{grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr)}}
@media(max-width:990px){.workspace{grid-template-columns:minmax(0,1fr) 270px}.imports{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;column-gap:18px}.imports .block{border-bottom:0;margin-bottom:0;padding-bottom:0}.stage{grid-column:1}.controls{grid-column:2;grid-row:2;position:static;max-height:none}}
@media(max-width:680px){.page{padding:10px}.top h1{font-size:22px}.brand{display:none}.workspace{grid-template-columns:1fr}.imports{display:block}.imports .block{padding-bottom:16px;margin-bottom:16px;border-bottom:1px solid var(--border)}.stage,.controls{grid-column:1;grid-row:auto}.controls{position:static}.preview{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}.stagehead{align-items:flex-start}}
@media(max-width:440px){.preview{grid-template-columns:1fr}.frame:first-child{max-width:320px}.rowbuttons .btn{font-size:11px}}


/* V6 : deux marques, un moteur et une bibliothèque commune */
:root{--primary:#8a6846;--primaryDark:#6c4e32;--accent:#c8a878;--soft:#fbf3e8;--surface:#f6f0e8;--muted:#785e43;--border:#e7dccd}
:root[data-marque="homedirect"]{--primary:#1e568b;--primaryDark:#17436c;--accent:#83add0;--soft:#edf5fd;--surface:#eef4fa;--muted:#426b90;--border:#dbe7f1}
body{background:var(--surface);color:#263742}
.top h1{color:var(--primaryDark)}.brand{color:var(--primary);border-color:var(--accent);background:#fff}
.heading{color:var(--muted)}.btn.dark{background:var(--primary);border-color:var(--primary)}.btn.dark:hover{background:var(--primaryDark)}
.btn.verified{background:var(--soft);border-color:var(--accent);color:var(--primaryDark)}
.segment button.selected{background:var(--primary)}.segment{background:var(--soft)}
.swatch.active{outline-color:var(--primary)}.slider input[type=range],.toggleline input,.checkrow input{accent-color:var(--primary)}
.sliderTop output{color:var(--primary)}.upload{background:var(--soft);border-color:var(--accent);color:var(--primaryDark)}.upload:hover{background:var(--surface)}
.pattern.selected,.libraryCard.selected{border-color:var(--primary);background:var(--soft)}
.guide{background:var(--soft);border-color:var(--border)}.guide strong,.status{color:var(--primaryDark)}
.smallpill{background:var(--soft);color:var(--primaryDark)}.caption{background:var(--soft)}
.librarySection{margin-top:15px;border-top:1px solid var(--border);padding-top:13px}
.libraryTitle{font-size:12px;font-weight:800;color:var(--primaryDark);margin-bottom:7px}
.libraryGrid{display:grid;gap:8px;margin:8px 0 4px;max-height:350px;overflow-y:auto;padding:2px}
.photosGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.modelsGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
.libraryCard{background:#fff;border:2px solid var(--border);border-radius:8px;padding:5px;cursor:pointer;min-width:0;display:flex;flex-direction:column;gap:5px;text-align:left}
.libraryCard:hover{border-color:var(--accent)}.libraryCard img{width:100%;height:66px;object-fit:contain;background:#f7f7f5;border-radius:4px}
.photosGrid .libraryCard img{height:76px;object-fit:cover}
.libraryCard span{display:block;font-size:11px;line-height:1.25;color:#354448;overflow-wrap:anywhere}
.libraryCard small{font-size:10px;color:#7a8083}.libraryEmpty{grid-column:1/-1;font-size:11.5px;color:#748086;line-height:1.4;padding:8px 2px}
.filterLabel{font-size:11.5px;display:block;margin-top:10px;font-weight:650;color:#465353}.widthInput{margin-top:5px;padding:8px 9px;width:100%;border:1px solid var(--border);border-radius:7px;background:#fff;color:#263742;font:inherit;font-size:12px;box-sizing:border-box}
.widthInput:focus-visible{outline:2px solid var(--accent)}
@media(max-width:990px){.imports .block{border:0}.libraryGrid{max-height:260px}}

/* V7 — interface compacte, bibliothèque dans une fenêtre de sélection */
.libraryButton{font-size:12px;padding:11px 8px;border-color:var(--accent);color:var(--primaryDark);background:var(--soft)}
.uploadCompact{margin-top:8px;padding:10px 8px;font-size:12px}
.textButton{margin-top:7px;background:none;border:0;padding:3px 0;color:var(--primary);font-size:11px;text-decoration:underline;text-align:left}
.imports .minor{margin:6px 0 0}.detailsBlock{border-bottom:1px solid var(--border);padding:10px 0;margin-bottom:12px}
.detailsBlock summary{cursor:pointer;font-weight:800;color:var(--muted);font-size:11.5px;list-style-position:inside}
.detailsBlock .checkrow{margin:12px 0 5px}
.detailsBlock .mask-tools{margin:5px 0}.lastBlock{border:0}
.canvasWell{flex:1;min-height:0;min-width:0;display:flex;align-items:center;justify-content:center;background:#efede8;overflow:hidden}
.frame{display:flex;flex-direction:column}.canvasWell canvas{display:block;max-width:100%;max-height:100%;width:auto;height:auto;flex:none;background:#eeece6}
.compactHint{font-size:11px;margin:3px 0 10px;color:#65727c}
.libraryModal{padding:0;border:1px solid var(--border);border-radius:14px;width:min(940px,calc(100vw - 48px));height:min(700px,calc(100dvh - 54px));max-height:none;max-width:none;color:#243540;box-shadow:0 24px 90px #14251a55;background:#fff}
.libraryModal::backdrop{background:rgba(22,34,42,.67)}
.modalInner{height:100%;display:flex;flex-direction:column;min-height:0}
.modalHeader{flex:0 0 auto;display:flex;justify-content:space-between;align-items:flex-start;gap:20px;background:var(--soft);padding:18px 20px 13px;border-bottom:1px solid var(--border)}
.modalHeader h2{color:var(--primaryDark);margin:0 0 4px;font-size:21px}.modalHeader p{margin:0}
.modalFilters{display:flex;gap:13px;padding:12px 18px 4px;align-items:flex-end}.searchInput{flex:1;min-width:130px;width:100%;border:1px solid var(--border);padding:11px;border-radius:9px;font:inherit;font-size:13px}
.modalModelOptions{display:flex;align-items:center;gap:10px;flex:1.15}.modalModelOptions label{min-width:0;flex:1;font-size:11px;font-weight:700;color:var(--muted)}.modalModelOptions .widthInput{margin-top:4px}
.libraryModal #rangeInfo{padding:0 19px 7px;margin:0;font-size:11px}
.modalScroll{padding:12px 18px;flex:1;min-height:0;overflow:auto;scrollbar-width:thin}
.libraryModal .libraryGrid{grid-template-columns:repeat(auto-fill,minmax(148px,1fr));max-height:none;overflow:visible;gap:12px;margin:0}
.libraryModal .libraryCard{padding:8px;gap:6px;min-height:128px;border-width:2px}
.libraryModal .libraryCard img{height:100px;object-fit:contain;background:#f4f5f3}
.libraryModal .photosGrid .libraryCard img{height:116px;object-fit:cover}
.libraryModal .libraryCard span{font-size:12px;font-weight:700}.libraryModal .libraryCard small{font-size:10.5px}
.libraryCard[hidden]{display:none!important}.modalFooter{padding:10px 19px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--border);color:#627275;font-size:12px}
@media(min-width:1060px) and (min-height:600px){
 html,body{height:100%;overflow:hidden}
 .page{height:100dvh;max-width:none;padding:10px 12px;display:flex;flex-direction:column;min-height:0;overflow:hidden}
 .top{flex:none;margin-bottom:9px;min-height:43px;flex-wrap:nowrap}.top h1{font-size:21px;margin:0 0 3px}.top .sub{font-size:11.5px}.brand{padding:8px 10px}
 .workspace{flex:1;min-height:0;align-items:stretch;grid-template-columns:minmax(210px,240px) minmax(0,1fr) minmax(270px,295px);gap:10px}
 .panel{height:100%;min-height:0}
 .imports,.controls{overflow-y:auto;padding:13px;scrollbar-width:thin;position:static;max-height:none}
 .imports .block{padding-bottom:12px;margin-bottom:12px}.imports .heading{margin-bottom:8px}
 .stage{padding:11px;display:flex;flex-direction:column;min-height:0;overflow:hidden}
 .stagehead{flex:none;min-height:35px;margin:0 0 9px;flex-wrap:nowrap;gap:6px}.stagehead h2{font-size:16px}.stagehead p{font-size:10.5px}.stagehead .btn{padding:7px 8px;font-size:10.5px}
 .preview{flex:1;min-height:0;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:8px;align-items:stretch}
 .frame{min-height:0;height:100%}.framehead{padding:7px 8px;flex:none;font-size:11px}
 .caption{flex:none;padding:6px 8px;font-size:10.5px;margin:8px 0 0}.status{flex:none;margin-top:4px;min-height:15px;font-size:10.5px}
 .controls .heading{margin-bottom:8px}.controls .segment{margin-bottom:8px}.segment button{padding:7px 4px}
 .controls .controlSection{margin-top:10px;padding-top:10px}.controls .palette{gap:5px;margin-bottom:8px}.controls .swatch{aspect-ratio:auto;height:30px}
 .controls .slider{margin:6px 0 7px}.controls .slider input[type=range]{margin:4px 0 0}
 .controls .colorLine input[type=color]{height:29px}.controls .controlTitle{margin-bottom:7px}
 .controls .notice{font-size:10.5px}.controls .rowbuttons{margin-top:8px!important}.controls .rowbuttons .btn{padding:7px 8px;font-size:11px}
}
@media(max-width:1059px){.canvasWell canvas{width:100%;max-height:none}.modalModelOptions{flex-direction:column;align-items:stretch}.modalFilters{flex-direction:column;align-items:stretch}.modalModelOptions{width:100%;flex-direction:row}.libraryModal .libraryGrid{grid-template-columns:repeat(auto-fill,minmax(126px,1fr))}}
@media(max-width:680px){.libraryModal{width:calc(100vw - 18px);height:calc(100dvh - 22px)}.modalHeader{padding:12px}.modalFilters{padding:10px}.modalScroll{padding:10px}.libraryModal .libraryGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* V8 : ajustement direct, options numériques discrètes et perspective permanente. */
.geometrySection .directHint{font-size:12px;line-height:1.5;color:#536b77;margin:10px 0 12px}
.geometrySection .resetPosition{font-size:12px;padding:10px 8px;border-color:var(--accent);color:var(--primaryDark);background:var(--soft)}
.geometrySection .resetPosition:hover{background:var(--surface)}
.advancedGeometry{margin-top:12px!important;padding-top:12px!important;border-top:1px solid var(--border);border-bottom:0!important}
.advancedGeometry summary{font-size:12px;font-weight:700;cursor:pointer;color:var(--primaryDark)}
.advancedGeometry[open] summary{margin-bottom:8px}
.advancedGeometry .slider{margin:8px 0 10px}
.advancedGeometry .btn{margin-top:12px}
@media(min-width:1060px) and (min-height:600px){.geometrySection .directHint{font-size:11px;line-height:1.45;margin:7px 0 10px}.geometrySection .resetPosition{font-size:11px;padding:8px 7px}}