@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Fira+Code:wght@400;500&display=swap";body>footer{text-align:center;opacity:.75;border-top:1px solid color-mix(in srgb, currentColor 20%, transparent);padding:24px;font-size:.85rem}body>footer a{color:inherit}:root{--ad-slot-width:160px}@media (width<=1200px){aside.ad{display:none}}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg-color:#f8fafc;--panel-bg:#fff;--editor-bg:#fff;--text-color:#0f172a;--text-secondary:#475569;--border-color:#e2e8f0;--border-hover:#cbd5e1;--accent-color:#8b5cf6;--accent-hover:#7c3aed;--accent-light:#8b5cf61a;--btn-secondary-bg:#fff;--btn-secondary-text:#334155;--btn-secondary-border:#cbd5e1;--btn-secondary-hover:#f1f5f9;--success-color:#059669;--warn-color:#d97706;--error-color:#dc2626;--match-a-bg:#8b5cf640;--match-b-bg:#10b98140;--match-selected-bg:#f59e0b73;--font-sans:"Inter", sans-serif;--font-mono:"Fira Code", monospace;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;--transition-speed:.15s}html.dark{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-color:#0b0f19;--panel-bg:#111827;--editor-bg:#0f172a;--text-color:#f3f4f6;--text-secondary:#9ca3af;--border-color:#1f2937;--border-hover:#374151;--btn-secondary-bg:#1f2937;--btn-secondary-text:#e5e7eb;--btn-secondary-border:#374151;--btn-secondary-hover:#2d3748;--success-color:#10b981;--warn-color:#f59e0b;--error-color:#ef4444;--match-a-bg:#8b5cf659;--match-b-bg:#10b9814d}*{box-sizing:border-box;font-family:var(--font-sans);margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-color);min-height:100vh;transition:background-color var(--transition-speed) ease, color var(--transition-speed) ease;flex-direction:column;display:flex}header{background-color:var(--panel-bg);border-bottom:1px solid var(--border-color);z-index:10;box-shadow:var(--shadow-sm);transition:background-color var(--transition-speed) ease, border-color var(--transition-speed) ease;justify-content:space-between;align-items:center;padding:1rem 2.5rem;display:flex;position:sticky;top:0}.header-brand{align-items:center;gap:12px;display:flex}.header-logo{object-fit:contain;border-radius:6px;width:32px;height:32px}.header-title{letter-spacing:-.025em;color:var(--text-color);font-size:1.25rem;font-weight:600}.header-actions{align-items:center;gap:10px;display:flex}main{grid-template-columns:var(--ad-slot-width) minmax(0, 1400px) var(--ad-slot-width);flex:1;justify-content:center;gap:2.5rem;padding:2.5rem 2rem;display:grid}@media (width<=1200px){main{grid-template-columns:minmax(0,1400px)}}section{flex-direction:column;gap:1.25rem;width:100%;display:flex}.panel{background-color:var(--panel-bg);border:1px solid var(--border-color);box-shadow:var(--shadow-md);transition:background-color var(--transition-speed) ease, border-color var(--transition-speed) ease;border-radius:12px;flex-direction:column;display:flex;overflow:hidden}.panel-header{color:var(--text-secondary);border-bottom:1px solid var(--border-color);align-items:center;gap:8px;padding:.7rem 1.1rem;font-size:.85rem;font-weight:600;display:flex}.pattern-row{align-items:center;gap:8px;padding:.8rem 1.1rem;display:flex}.pattern-delim{font-family:var(--font-mono);color:var(--text-secondary);-webkit-user-select:none;user-select:none;font-size:1.2rem}#pattern-input{background:var(--editor-bg);min-width:0;color:var(--text-color);border:1px solid var(--border-color);font-family:var(--font-mono);transition:border-color var(--transition-speed) ease;border-radius:8px;outline:none;flex:1;padding:.55rem .8rem;font-size:.95rem}#pattern-input:focus{border-color:var(--accent-color)}.flag-group{gap:4px;display:flex}.flag-btn{border:1px solid var(--btn-secondary-border);background:var(--btn-secondary-bg);width:32px;height:32px;color:var(--text-secondary);font-family:var(--font-mono);cursor:pointer;transition:all var(--transition-speed) ease;border-radius:6px;font-size:.9rem}.flag-btn:hover{border-color:var(--border-hover);color:var(--text-color)}.flag-btn.active{background:var(--accent-color);border-color:var(--accent-color);color:#fff}.replace-row{align-items:center;gap:8px;padding:0 1.1rem .3rem;display:flex}.replace-toggle{color:var(--text-secondary);cursor:pointer;transition:color var(--transition-speed) ease;background:0 0;border:none;align-items:center;gap:5px;padding:.3rem .2rem;font-size:.85rem;font-weight:600;display:inline-flex}.replace-toggle:hover{color:var(--text-color)}.replace-toggle .chevron{transition:transform var(--transition-speed) ease}.replace-toggle.open{color:var(--accent-color)}.replace-toggle.open .chevron{transform:rotate(90deg)}#replace-input{background:var(--editor-bg);min-width:0;color:var(--text-color);border:1px solid var(--border-color);font-family:var(--font-mono);transition:border-color var(--transition-speed) ease;border-radius:8px;outline:none;flex:1;padding:.45rem .8rem;font-size:.9rem}#replace-input:focus{border-color:var(--accent-color)}.hidden{display:none!important}.pattern-status{min-height:1.6rem;padding:.45rem 1.1rem .7rem;font-size:.85rem;font-weight:500}.pattern-status.ok{color:var(--success-color)}.pattern-status.warn{color:var(--warn-color)}.pattern-status.error{color:var(--error-color)}.pattern-status.idle{color:var(--text-secondary)}.workspace{flex:1;grid-template-columns:minmax(0,1fr) minmax(280px,380px);align-items:stretch;gap:1.25rem;min-height:480px;display:grid}@media (width<=900px){.workspace{grid-template-columns:minmax(0,1fr)}}.workspace-left{flex-direction:column;gap:1.25rem;min-width:0;display:flex}.editor-panel{flex:1;min-height:0}.workspace-left:has(.result-panel:not(.hidden)) .editor-panel{min-height:280px}#editor{flex-direction:column;flex:1;display:flex}.cm-editor{flex:1;height:100%}.cm-scroller{font-family:var(--font-mono)!important;font-size:.95rem!important}.cm-gutters{background-color:var(--panel-bg)!important;border-right:1px solid var(--border-color)!important;color:var(--text-secondary)!important}.cm-activeLineGutter{background-color:var(--accent-light)!important;color:var(--accent-color)!important}.cm-activeLine{background-color:var(--accent-light)!important}.cm-match{border-radius:2px}.cm-match-a{background-color:var(--match-a-bg)}.cm-match-b{background-color:var(--match-b-bg)}.cm-match-selected{background-color:var(--match-selected-bg);outline:1px solid var(--warn-color)}.cm-match-empty{vertical-align:text-bottom;background-color:var(--warn-color);width:2px;height:1em;display:inline-block}.matches-panel{min-height:0}@media (width<=900px){.editor-panel{min-height:360px}.matches-panel{min-height:300px}}.match-count-badge{background:var(--accent-light);color:var(--accent-color);border-radius:999px;padding:.05rem .55rem;font-size:.8rem}.match-list{flex-direction:column;flex:1;gap:.5rem;padding:.6rem;display:flex;overflow-y:auto}.match-list-empty{color:var(--text-secondary);text-align:center;padding:.6rem;font-size:.85rem}.match-item{text-align:left;background:var(--editor-bg);border:1px solid var(--border-color);cursor:pointer;color:var(--text-color);transition:border-color var(--transition-speed) ease, background-color var(--transition-speed) ease;border-radius:8px;flex-direction:column;gap:.35rem;padding:.6rem .75rem;display:flex}.match-item:hover{border-color:var(--accent-color)}.match-item.selected{border-color:var(--warn-color)}.match-item-head{color:var(--text-secondary);justify-content:space-between;font-size:.75rem;display:flex}.match-item-index{color:var(--accent-color);font-weight:600}.match-item-range{font-family:var(--font-mono)}.match-item-text{font-family:var(--font-mono);word-break:break-all;white-space:pre-wrap;font-size:.85rem}.match-groups{border-top:1px dashed var(--border-color);flex-direction:column;gap:.2rem;padding-top:.35rem;font-size:.8rem;list-style:none;display:flex}.match-groups li{align-items:baseline;gap:.5rem;display:flex}.match-groups .group-label{color:var(--text-secondary);font-family:var(--font-mono);white-space:nowrap}.match-groups code{font-family:var(--font-mono);word-break:break-all;white-space:pre-wrap}.match-groups em{color:var(--text-secondary)}.result-panel{flex-shrink:0;max-height:300px}.result-panel .panel-header{justify-content:space-between}.copy-btn{background:var(--btn-secondary-bg);color:var(--btn-secondary-text);border:1px solid var(--btn-secondary-border);cursor:pointer;transition:all var(--transition-speed) ease;border-radius:6px;align-items:center;gap:5px;padding:.25rem .6rem;font-size:.75rem;font-weight:500;display:inline-flex}.copy-btn:hover{background:var(--btn-secondary-hover);border-color:var(--border-hover)}.replace-output{background:var(--editor-bg);font-family:var(--font-mono);color:var(--text-color);white-space:pre-wrap;word-break:break-all;flex:1;min-height:90px;padding:.9rem 1.1rem;font-size:.9rem;overflow:auto}.app-viewport{flex-direction:column;min-height:100vh;display:flex}.page-content{max-width:760px;color:var(--text-secondary);flex-direction:column;gap:1.75rem;margin:0 auto;padding:1rem 1.5rem 4rem;font-size:.95rem;line-height:1.7;display:flex}.page-content h2{color:var(--text-color);border-bottom:1px solid var(--border-color);margin-bottom:.6rem;padding-bottom:.4rem;font-size:1.15rem}.page-content ul{padding-left:1.25rem}.page-content li{margin-bottom:.4rem}.page-content p{margin-bottom:.6rem}.page-content strong{color:var(--text-color)}.page-content code{background-color:var(--panel-bg);border:1px solid var(--border-color);font-size:.9em;font-family:var(--font-mono);border-radius:4px;padding:.1em .4em}.btn{cursor:pointer;transition:all var(--transition-speed) ease;border:1px solid #0000;border-radius:8px;outline:none;justify-content:center;align-items:center;gap:8px;padding:.6rem 1.2rem;font-size:.9rem;font-weight:500;display:inline-flex}.btn:active{transform:translateY(0)}.btn-secondary{background-color:var(--btn-secondary-bg);color:var(--btn-secondary-text);border-color:var(--btn-secondary-border)}.btn-secondary:hover{background-color:var(--btn-secondary-hover);border-color:var(--border-hover);transform:translateY(-1px)}#theme-toggle-btn{aspect-ratio:1;border-radius:8px;padding:.6rem}#theme-toggle-btn svg{display:block}html:not(.dark) #theme-toggle-btn .sun-icon,html.dark #theme-toggle-btn .moon-icon{display:none}
