.free-reference input[type=url],[data-simulator-mode=free] textarea[data-custom]{width:100%;min-width:0;padding:9px;border:1px solid var(--border,#c9cbea);border-radius:9px;background:var(--card,#fff);color:var(--text,#203438);font:inherit}
.free-reference small,.free-reference [role=status]{display:block;font-size:11px;line-height:1.45;margin-top:8px;overflow-wrap:anywhere}
.free-reference-view{position:relative;height:220px;margin:0 0 6px;border-radius:9px;background:#edf0f5;overflow:hidden}
.free-reference-view:has(img[hidden]){display:none}
.free-reference-view img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain}
.free-reference-view img[hidden]{display:none}
[data-simulator-mode=free] .hair-tools,[data-simulator-mode=free] .hair-card{min-width:0;min-height:0}
[data-simulator-mode=free] .hair-tools{overflow-wrap:anywhere}
@media(min-width:1200px){
  [data-simulator-mode=free]{grid-template-rows:minmax(0,1fr)}
  [data-simulator-mode=free] .hair-tools{max-height:100%;overflow:visible!important}
}
/* Stacked layouts scroll with the page, including the 1000–1199px tablet range. */
@media(max-width:1199px){
  body.free-simulator-page{height:auto;overflow:auto}
  .free-simulator-page .hair-main{height:auto;overflow:visible}
}
[data-simulator-mode=free] textarea[data-custom]{min-height:75px;resize:vertical}
@media(max-width:650px){.free-reference input[type=url],[data-simulator-mode=free] textarea[data-custom]{font-size:16px}}
[data-simulator-mode=free] .hair-card h2{font:700 13px Montserrat,Arial,sans-serif!important}
[data-simulator-mode=free] .hair-card label{font-size:11px!important;line-height:1.4!important}
[data-simulator-mode=free] .hair-tools>p,[data-simulator-mode=free] .hair-privacy{display:block;font-size:11px!important;line-height:1.45!important}
[data-simulator-mode=free] textarea[data-custom]{font-size:13px}
@media(max-width:1199px){[data-simulator-mode=free] .hair-stage{min-height:320px;max-height:65vh}}
@media(max-width:650px){[data-simulator-mode=free] textarea[data-custom]{font-size:16px}[data-simulator-mode=free] .hair-stage-panel{min-height:450px}}
/* Images must fit their frame without intrinsic dimensions overflowing the grid. */
[data-simulator-mode=free] .hair-stage{position:relative}
[data-simulator-mode=free] .hair-stage img{position:absolute;inset:0;width:100%;height:100%;min-width:0;min-height:0;object-fit:contain;object-position:center}
[data-simulator-mode=free] .sim-thumb-frame{position:relative}
[data-simulator-mode=free] .sim-thumb-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center}
.free-image-dialog{padding:0;border:1px solid var(--border,#c9cbea);border-radius:16px;background:var(--card,#fff);color:var(--text,#203438);width:min(1400px,96vw);height:92dvh;max-width:96vw;max-height:94dvh;margin:auto;overflow:hidden}
.free-image-dialog[open]{display:grid;grid-template-rows:auto minmax(0,1fr)}
.free-image-dialog::backdrop{background:rgba(0,0,0,.8)}
.free-image-dialog header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px}
.free-image-dialog header button{width:44px;min-height:44px;border:1px solid var(--border,#c9cbea);border-radius:10px;cursor:pointer;background:var(--card,#fff);color:inherit}
.free-image-view{position:relative;min-height:0;min-width:0;background:#101828}
.free-image-view img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center}
@media(min-width:1200px){
  [data-simulator-mode=free]{grid-template-columns:minmax(340px,380px) minmax(0,1fr) 260px}
  [data-simulator-mode=free] .hair-tools{display:flex;flex-direction:column}
  [data-simulator-mode=free] .hair-tools>*{flex-shrink:0}
  [data-simulator-mode=free] .free-reference-view{flex:1 1 0;min-height:0;height:auto}
  [data-simulator-mode=free] .hair-tools>.hair-card:last-of-type{margin-top:auto!important}
  [data-simulator-mode=free] .hair-kicker,[data-simulator-mode=free] .hair-tools>p,.free-reference>small{display:none!important}
  [data-simulator-mode=free] .hair-tools h1{font-size:24px!important;line-height:1!important;margin:0 0 6px!important}
  [data-simulator-mode=free] .hair-card{padding:7px!important;margin-bottom:6px!important}
  [data-simulator-mode=free] .hair-card label{font-size:10px!important;margin:0!important}
  [data-simulator-mode=free] .hair-photo-actions{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
  [data-simulator-mode=free] .hair-upload{grid-column:auto}
  [data-simulator-mode=free] .hair-reset-photo{margin:0!important}
  [data-simulator-mode=free] .hair-photo-actions button,[data-simulator-mode=free] .hair-upload,[data-simulator-mode=free] .hair-reset-photo{min-height:27px!important;font-size:10px!important;padding:3px}
  .free-reference{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4px 6px;align-items:center}
  .free-reference h2,.free-reference .hair-photo-actions{grid-column:1/-1}
  .free-reference h2{margin:0!important}
  .free-reference:first-of-type>label{grid-column:1/-1;grid-row:4}
  .free-reference [data-original]{grid-row:3;grid-column:1}
  .free-reference [data-target-full]{grid-row:3;grid-column:2}
  .free-reference [data-target-load]{grid-row:5;grid-column:1}
  .free-reference [data-target-status]{grid-row:5;grid-column:2}
  .free-reference:nth-of-type(2)>.hair-upload{grid-row:2;grid-column:1}
  .free-reference [data-reference-full]{grid-row:2;grid-column:2}
  .free-reference:nth-of-type(2)>label:not(.hair-upload){grid-row:3;grid-column:1/-1}
  .free-reference [data-reference-load]{grid-row:4;grid-column:1}
  .free-reference [data-reference-status]{grid-column:2;grid-row:4}
  .free-reference [role=status]{font-size:10px;line-height:1.2;margin:0}
  .free-reference [role=status]:empty{display:none}
  .free-reference input[type=url]{height:27px;padding:4px 6px;font-size:11px}
  [data-simulator-mode=free] textarea[data-custom]{min-height:48px;height:48px;resize:none;padding:5px;font-size:12px}
  [data-simulator-mode=free] .hair-privacy{font-size:9px!important;line-height:1.25!important}
}
@media(min-width:1200px) and (max-height:700px){
  [data-simulator-mode=free] .hair-card{padding:4px!important;margin-bottom:4px!important}
  .free-reference{row-gap:2px}
  [data-simulator-mode=free] .hair-photo-actions button,[data-simulator-mode=free] .hair-upload,[data-simulator-mode=free] .hair-reset-photo{min-height:25px!important}
  [data-simulator-mode=free] textarea[data-custom]{height:36px;min-height:36px}
}