.regex-tools-page{max-width:1200px;min-height:100dvh;color:var(--foreground);margin:0 auto;padding:32px 32px 80px;font-size:1rem}.regex-tools-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-bottom:36px;display:flex}.regex-tools-brand{align-items:center;display:flex}.regex-tools-back,.regex-notes a{color:var(--foreground);text-underline-offset:4px;text-decoration:underline}.regex-heading{align-items:center;gap:16px;margin-bottom:24px;display:flex}.regex-heading>svg{background:color-mix(in srgb, var(--accent) 15%, var(--surface));border-radius:12px;flex-shrink:0;width:48px;height:48px;padding:10px}.regex-heading h1{letter-spacing:-.04em;margin:0;font-size:clamp(1.65rem,4vw,2.25rem)}.regex-heading p{color:var(--muted);margin:8px 0 0;line-height:1.6}.regex-workspace{border:1px solid var(--border-strong);background:var(--surface);border-radius:18px;overflow:hidden}.regex-pattern-area{padding:24px}.regex-pattern-area>label,.regex-pane-title>label{font-size:.875rem;font-weight:600;display:block}.regex-pattern-area>input{box-sizing:border-box;border:1px solid var(--border-strong);background:var(--background);width:100%;min-height:48px;color:var(--foreground);border-radius:9px;margin-top:10px;padding:12px 14px;font:1rem/1.6 ui-monospace,monospace}.regex-hint,.regex-notes{color:var(--muted);overflow-wrap:anywhere;font-size:.875rem;line-height:1.65}.regex-flags{border:0;flex-wrap:wrap;gap:8px 16px;margin:20px 0 0;padding:0;display:flex}.regex-flags legend{margin-bottom:6px;padding:0;font-size:.875rem;font-weight:600}.regex-flags label{cursor:pointer;align-items:center;gap:8px;min-height:44px;font-size:.875rem;display:inline-flex}.regex-flags input{width:18px;height:18px;accent-color:var(--accent)}.regex-flags code{font-size:1rem;font-weight:700}.regex-replacement-input{margin-top:20px}.regex-replacement-input>label{font-size:.875rem;font-weight:600;display:block}.regex-replacement-input textarea,.regex-replacement-result textarea{box-sizing:border-box;resize:vertical;border:1px solid var(--border-strong);background:var(--background);width:100%;color:var(--foreground);border-radius:9px;margin-top:10px;padding:12px 14px;font:1rem/1.7 ui-monospace,monospace}.regex-replacement-input textarea{min-height:80px}.regex-replacement-help summary{text-underline-offset:4px;cursor:pointer;align-items:center;min-height:44px;font-size:.875rem;text-decoration:underline;display:inline-flex}.regex-replacement-help p{margin:4px 0 12px}.regex-replacement-result{border:1px solid var(--border-strong);background:var(--surface);border-radius:14px;margin-top:24px;padding:20px 24px}.regex-replacement-result h2{font-size:1.125rem}.regex-replacement-result textarea{min-height:200px}.regex-replacement-error{border:1px solid var(--border-strong);border-radius:9px;padding:14px;font-size:1rem;line-height:1.7}.regex-panes{border-top:1px solid var(--border);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.regex-editor,.regex-preview{min-width:0;padding:20px 24px}.regex-preview{border-left:1px solid var(--border)}.regex-pane-title{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:10px;display:flex}.regex-pane-title span{color:var(--muted);font-size:.875rem}.regex-preview h2{margin:0;font-size:.875rem}.regex-editor textarea{box-sizing:border-box;resize:vertical;border:1px solid var(--border-strong);background:var(--background);width:100%;min-height:240px;color:var(--foreground);border-radius:9px;margin-top:14px;padding:14px;font:1rem/1.8 ui-monospace,monospace;display:block}.regex-tools-page pre{white-space:pre-wrap;overflow-wrap:anywhere;font:1rem/1.8 ui-monospace,monospace}.regex-preview pre{max-height:400px;margin:14px 0 0;overflow:auto}.regex-preview mark{color:var(--foreground);background:color-mix(in srgb, var(--accent) 28%, var(--surface));box-shadow:inset 0 -2px var(--accent)}.regex-empty-mark{font-weight:700;display:inline-block}.regex-actions{border-top:1px solid var(--border);background:var(--surface-soft);flex-wrap:wrap;align-items:center;gap:12px;padding:16px 24px;display:flex}.regex-actions p{flex-basis:100%;margin:0;font-size:.875rem;line-height:1.6}.regex-tools-page button{border:1px solid var(--border-strong);background:var(--surface);min-height:44px;color:var(--foreground);font:inherit;cursor:pointer;border-radius:9px;justify-content:center;align-items:center;padding:10px 16px;display:inline-flex}.regex-tools-page button.regex-primary{background:var(--foreground);color:var(--background);border-color:var(--foreground);font-weight:700}.regex-tools-page button:disabled{opacity:.5;cursor:not-allowed}.regex-tools-page :is(input,textarea,button,summary,a):focus-visible{outline:2px solid var(--accent);outline-offset:4px}.regex-tools-page [aria-invalid=true]{border-color:var(--accent)}.regex-results{margin-top:28px}.regex-results-heading{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.regex-results h2{font-size:1.125rem}.regex-copy-status{min-height:1.5em;font-size:.875rem}.regex-match-list{margin:0;padding:0;list-style:none}.regex-match-list li{border-bottom:1px solid var(--border);padding:10px 0}.regex-match-list summary{cursor:pointer;overflow-wrap:anywhere;min-height:44px;padding:10px 4px;line-height:1.6}.regex-match-list summary>*{margin-right:14px}.regex-match-list summary span{color:var(--muted);font-size:.875rem}.regex-match-list pre{background:var(--surface);border-radius:8px;max-height:300px;padding:12px;overflow:auto}.regex-match-list dl>div{grid-template-columns:minmax(48px,auto) minmax(0,1fr);gap:12px;padding:8px 0;display:grid}.regex-match-list dt{overflow-wrap:anywhere;font-weight:600}.regex-match-list dd{white-space:pre-wrap;overflow-wrap:anywhere;margin:0;font:1rem/1.6 ui-monospace,monospace}.regex-notes{margin-top:28px}.regex-notes a{align-items:center;min-height:44px;display:inline-flex}.regex-tools-footer{border-top:1px solid var(--border);color:var(--muted);margin-top:36px;padding-top:20px;font-size:.875rem}@media (width<=700px){.regex-tools-page{padding:24px 16px 100px}.regex-panes{grid-template-columns:minmax(0,1fr)}.regex-preview{border-left:0;border-top:1px solid var(--border)}.regex-pattern-area,.regex-editor,.regex-preview,.regex-actions,.regex-replacement-result{padding:20px 16px}}
