.swatch{padding:16px;border:1px solid var(--line);border-radius:14px;font-size:1rem;margin-bottom:16px}
.pattern-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto 72px;align-items:center;gap:8px;margin-bottom:16px}
.pattern-row input{width:100%;min-width:0}
.match-preview{max-height:320px;overflow:auto;margin:0 0 16px;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--surface-soft);color:var(--ink);font:0.94rem/1.65 ui-monospace,SFMono-Regular,Consolas,monospace;text-align:left;white-space:pre-wrap;overflow-wrap:anywhere}
.match-preview mark{border-radius:6px;background:var(--accent-soft);color:var(--ink);outline:1px solid var(--accent)}
.error-detail{margin:0 12px 12px;color:var(--ink-soft);font-size:.84rem;overflow-wrap:anywhere}
@media(max-width:560px){.pattern-row{grid-template-columns:auto minmax(0,1fr) auto 54px}}