.masked-editor{max-width:min(1080px,96vw);width:min(1080px,96vw);max-height:95dvh;overflow:auto;border:1px solid #ccd4ce;border-radius:20px;padding:24px;color:#202b29;background:#f6f7f5}.masked-editor::backdrop{background:#182820aa}.masked-editor header{display:flex;justify-content:space-between;align-items:center;position:sticky;top:-24px;background:#f6f7f5;z-index:2;padding:12px 0}.masked-editor h2{margin:0}.masked-editor label{display:block;margin:15px 0}.masked-editor input:not([type=checkbox]),.masked-editor select{display:block;width:100%;padding:12px;margin-top:6px}.masked-editor input[type=checkbox]{display:inline;width:auto}.masked-editor button{min-height:46px;margin:4px;border:1px solid #bfcac4;border-radius:10px;padding:11px 15px;cursor:pointer}.masked-editor button:disabled{opacity:.5;cursor:default}.masked-editor button[aria-pressed=true]{background:#264e3e;color:white}.masked-editor canvas{width:100%;height:auto;touch-action:none;background:#dce2df;border:2px solid #64776a;display:block}.mask-tools{display:flex;flex-wrap:wrap;align-items:center;gap:6px}.mask-tools label{max-width:170px}.mask-results{display:flex;gap:8px;max-height:190px;overflow:auto;flex-wrap:wrap}.mask-results button{flex:1 1 220px;text-align:left}.mask-results small{display:block}.mask-reference{width:160px;height:120px;object-fit:contain}.masked-result{width:100%;height:auto}.masked-editor .warning,.masked-editor .application-warnings{background:#fbf1da;padding:15px;border-radius:12px}.masked-editor p{line-height:1.6}.masked-editor :focus-visible{outline:3px solid #4682b4;outline-offset:2px}@media(max-width:600px){.masked-editor{padding:15px}.masked-editor header{top:-15px}.masked-editor h2{font-size:22px}.mask-tools button{flex:1 1 40%}}

.mask-compare{display:grid;grid-template-columns:2fr 1fr;gap:16px}.mask-compare figure{margin:0}.mask-compare img{width:100%;height:auto;object-fit:contain}.mask-compare figcaption{font-size:14px;line-height:1.5}@media(max-width:600px){.mask-compare{grid-template-columns:1fr}}
