html#itodiUi .top416-panel { padding: 4px 0 12px; color: #292d33; }
html#itodiUi .top416-panel h3 { font-size: 15px; font-weight: 600; margin: 0 0 10px; }
html#itodiUi .top416-panel h4 { font-size: 13px; font-weight: 500; margin: 20px 0 8px; }
html#itodiUi .top416-note { font-size: 12px; line-height: 1.5; color: #737c8c; margin: 8px 0 12px; }
html#itodiUi .top416-options { display: flex; flex-wrap: wrap; gap: 7px; margin: 8px 0; }
html#itodiUi .top416-button { font: inherit; font-size: 13px; min-height: 40px; padding: 8px 12px; border: 1px solid #dce2ee; border-radius: 9px; color: #343d47; background: #fff; cursor: pointer; }
html#itodiUi .top416-button[aria-pressed=true] { border-color: #2048ff; background: #eef2ff; color: #2048ff; }
html#itodiUi .top416-button:disabled { opacity: .45; cursor: default; }
html#itodiUi .top416-field { display: grid; grid-template-columns: minmax(110px, .8fr) minmax(0, 1.5fr); align-items: center; gap: 12px; margin: 12px 0 !important; font-size: 13px; }
html#itodiUi .top416-field :is(select,input) { min-width: 0; width: 100%; min-height: 40px; border: 1px solid #dce2ee; border-radius: 8px; background: white; color: #292d33; padding: 8px; font: inherit; }
html#itodiUi .top416-preview { display: flex; align-items: center; gap: 10px; margin: 16px 0; font-size: 13px; }
html#itodiUi .top416-swatch { display: block; width: 44px; height: 44px; flex: 0 0 44px; border: 1px solid #dce2ee; border-radius: 8px; background-size: cover; }
html#itodiUi:not([data-visual-group=color][data-visual-route=top]) #itodiCountertopPanel416 { display: none !important; }
html#itodiUi[data-visual-group=color][data-visual-route=top] #step4 > :not(#itodiCountertopPanel416),
html#itodiUi[data-visual-group=color][data-visual-route=top] :is(#itsMaterialFamilyLabel,#itsMaterialFamilyTabs,.itodi-mdf-entry,#itodiMdfMaterialDrawer) { display: none !important; }
@media(max-width:760px) { html#itodiUi .top416-field {grid-template-columns: minmax(0,1fr);gap:6px} html#itodiUi .top416-button {min-height:44px} }

/* Override the legacy material-family header on the independent countertop route. */
html#itodiUi#itodiUi#itodiUi#itodiUi#itodiUi#itodiUi#itodiUi#itodiUi#itodiUi#itodiUi[data-visual-group=color][data-visual-route=top] #itsPanelHeader { display:none !important; }
