.wf-inspector { margin-block: 1rem 1.5rem; }
.wf-inspector-title { color: #173d58; font-weight: 650; margin-block: 0 1rem; overflow-wrap: anywhere; }
.wf-inspector-host { height: clamp(260px, 43vw, 440px); width: 100%; background: #f2f7fc; border-radius: 12px; overflow: hidden; }
.wf-inspector-host canvas { display: block; width: 100%; height: 100%; touch-action: none; }
.wf-inspector-host canvas:focus-visible { outline: 3px solid #1266a4; outline-offset: -4px; }
.wf-inspector-status { color: #284c65; font-size: .95rem; }
.wf-inspector-notes { max-width: 75ch; line-height: 1.5; }
.wf-inspector-dialog { width: min(1100px, calc(100vw - 24px)); max-width: none; max-height: calc(100dvh - 24px); border: 1px solid #c4d5e2; border-radius: 14px; padding: 1rem; color: #173d58; background: #fff; }
.wf-inspector-dialog::backdrop { background: rgb(12 32 49 / .55); }
.wf-inspector-dialog form { display: flex; justify-content: flex-end; margin: 0; }
.wf-inspector-dialog [data-inspect-action="fullscreen"] { display: none; }
.wf-inspector-host > img { width: 100%; height: 100%; object-fit: contain; }
.wf-inspector-dialog .wf-inspector-host { height: min(58dvh, 600px); }
.wg-tools button:focus-visible { outline: 3px solid #1266a4; outline-offset: 3px; }
[data-washer-family] select { max-width: 100%; min-width: 0; }
[data-washer-family] .field-grid > label { min-width: 0; }
[data-washer-family] [hidden] { display: none !important; }
@media (max-width: 600px) {
 .wf-inspector-dialog { padding: .75rem; }
 .wf-inspector-host { height: 300px; }
 .wg-tools { gap: .5rem; }
 .wg-tools button { min-height: 44px; }
}
@media print { .wf-inspector, .wf-inspector-dialog { display: none !important; } }