/* Compact, flat product palette: one selected piece and one material inspector. */
#pfProductMaterials{min-width:0;color:inherit}
#pfProductMaterials [hidden],.pf-material-old-core{display:none!important}
#pfProductMaterials p{line-height:1.45}
#pfProductMaterials .pf-palette-intro{margin:8px 0 10px;font-size:12px;opacity:.85}
#pfProductMaterials .pf-palette-mobile-hint{display:none}
#pfMaterialPalette{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-bottom:14px}
#pfMaterialPalette .pf-palette-piece{display:flex;align-items:center;gap:7px;padding:8px;text-align:left;min-width:0;min-height:54px;white-space:normal;overflow-wrap:anywhere;border:1px solid var(--app-border,#d4dfe3);border-radius:8px;background:var(--app-panel,#f7f9fa);color:inherit}
#pfMaterialPalette .pf-palette-piece>span:last-child{display:grid;min-width:0;gap:3px}
#pfMaterialPalette strong{font-size:12px;line-height:1.2}
#pfMaterialPalette small{font-size:10px;line-height:1.25;opacity:.8}
#pfMaterialPalette .pf-palette-piece[aria-pressed=true]{border-color:var(--app-accent,#07808b);box-shadow:inset 0 0 0 1px var(--app-accent,#07808b);background:color-mix(in srgb,var(--app-accent,#07808b) 14%,var(--app-panel,#f7f9fa))}
#pfMaterialPalette .pf-palette-swatch{position:relative;flex:0 0 23px;height:30px;border:1px solid #88969d99;border-radius:5px;background:var(--swatch-color,#fff);overflow:hidden}
#pfMaterialPalette .pf-palette-clear{background:conic-gradient(#b7c4c8 25%,#edf2f3 0 50%,#b7c4c8 0 75%,#edf2f3 0) 0 0/10px 10px}
#pfMaterialPalette .pf-palette-clear::after{content:'';position:absolute;inset:0;background:var(--swatch-color);opacity:.45}
#pfMaterialInspector{border-top:1px solid var(--app-border,#d4dfe3);padding-top:9px}
#pfMaterialInspector h3{margin:2px 0 5px;font-size:15px;letter-spacing:0;text-transform:none}
#pfMaterialInspector label{display:block;margin:10px 0;min-width:0;white-space:normal}
#pfMaterialInspector select,#pfMaterialInspector input{min-width:0;max-width:100%;width:100%;box-sizing:border-box}
#pfMaterialInspector input[type=color]{height:38px;padding:4px}
#pfMaterialInspector .pf-image-picker{margin-top:5px}
#pfMaterialRoughnessValue{float:right;font-variant-numeric:tabular-nums}
#pfMaterialInspector input[type=range]{margin-top:7px}
#pfMaterialMore{padding-top:8px;margin-top:10px;border-top:1px solid var(--app-border,#d4dfe3)}
#pfMaterialMore summary{display:list-item!important;cursor:pointer;font-weight:600}
#pfMaterialBodyTools,#pfMaterialClosureTools{margin-top:14px;border-top:1px solid var(--app-border,#d4dfe3);padding-top:10px}
#pfMaterialBodyTools:empty,#pfMaterialClosureTools:empty{display:none}
#pfMaterialError,.pf-material-note{padding:8px;border:1px solid #ba965b;border-radius:6px}
#pfProductMaterials button{white-space:normal;overflow-wrap:anywhere;min-width:0}
#pfMaterialBodyTools>.grid:empty{display:none}
body[data-pf-phone-ui=true] #controls #pfProductMaterials summary{display:list-item!important}
@media(min-width:921px){#pfMaterialPalette:has(>.pf-palette-piece:nth-child(9)){grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:920px){
 #pfProductMaterials .pf-palette-intro{display:none}
 #pfProductMaterials .pf-palette-mobile-hint{display:block;font-size:11px;margin:3px 0 5px;opacity:.8}
 #pfMaterialPalette{display:flex;gap:6px;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;padding:4px 1px 6px;margin-bottom:8px;position:sticky;top:var(--pf-material-sticky-top,96px);z-index:5;background:var(--app-panel,#f7f9fa)}
 #pfMaterialPalette .pf-palette-piece{flex:0 0 140px;min-height:50px;scroll-snap-align:start;padding:6px}
 #pfMaterialInspector h3{font-size:14px}
 #pfMaterialPieceNote{margin:5px 0}
}