.mask-panel{margin:15px 16px 0;padding:14px;background:#111f33;border:1px solid #2b405e;border-radius:8px;color:#b9cce5}.mask-heading{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.mask-heading h3{font-size:12px;margin:0 auto 0 0;color:#e0edff;font-weight:650}.mask-tools{display:flex;gap:3px}.mask-panel button{font-size:10px;padding:7px 9px}.mask-tools button[aria-pressed=true]{background:#2459bb;border-color:#5387e6;color:white}.mask-options{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:13px;margin:13px 0}.mask-panel label{font-size:9px;color:#89a3c5;line-height:1.4}.mask-panel select,.mask-panel input[type=number]{display:block;width:100%;min-width:0;background:#091423;border:1px solid #304761;color:#d5e4f8;border-radius:5px;padding:7px 6px;font-size:10px;color-scheme:dark;margin-top:5px}.mask-options input[type=range]{display:block;width:100%;height:7px;accent-color:#72afff;margin:15px 0 0;cursor:pointer}.mask-options output{color:#b9d8ff;float:right;font:9px Consolas,monospace}.mask-exact{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:8px;align-items:end}.mask-exact button{min-height:31px}.mask-actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin-top:12px}.mask-actions label{display:flex;align-items:center;gap:5px;color:#a6bcd9;white-space:nowrap}.mask-actions input[type=checkbox]{accent-color:#73adff;width:12px;height:12px;margin:0}.mask-actions .mask-listen{background:#1d60dc;border-color:#5288ed;color:#fff;font-weight:600}.mask-regions{display:flex;gap:5px;flex-wrap:wrap;margin-top:11px;font-size:9px;color:#6e89ab;line-height:1.6;max-height:78px;overflow:auto}.mask-region{display:flex;align-items:center;border:1px solid #324967;border-radius:4px;max-width:100%;background:#0c1829}.mask-region.active{border-color:#d0a556}.mask-region button{background:transparent;border:0;padding:4px 7px;font:9px Consolas,monospace;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#a5bddb}.mask-region button:last-child{color:#d0a8b1;padding:4px 8px}.mask-feedback{display:flex;gap:8px;justify-content:space-between;flex-wrap:wrap;font-size:9px;color:#94badc;margin-top:10px;line-height:1.6}.mask-feedback #mask-meter{font-family:Consolas,monospace;color:#77c5b8}.mask-help{font-size:9px;line-height:1.7;color:#6482a6;margin:8px 0 0}.instrument[data-tool=mask] #overlay{cursor:crosshair}.mask-feedback.error{color:#ffb1b1}
@media(max-width:1100px){.mask-heading h3{width:100%;margin-bottom:4px}.mask-exact{grid-template-columns:repeat(4,minmax(0,1fr))}.mask-exact button{grid-column:1/-1;justify-self:start}.mask-options{gap:9px}.mask-actions{gap:8px}.mask-options{grid-template-columns:1fr 1fr}.mask-options>label:first-child{grid-column:1/-1}}
@media(max-width:760px){.mask-panel{margin:12px 10px 0;padding:12px}.mask-exact{grid-template-columns:repeat(2,minmax(0,1fr))}.mask-panel select,.mask-panel input[type=number]{font-size:12px}.mask-actions{gap:12px}.mask-options label,.mask-exact label,.mask-actions label{font-size:10px}.mask-heading button{font-size:10px}.mask-help{font-size:10px}}