.tester-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);overflow:hidden;}.regex-row{display:flex;align-items:stretch;border-bottom:1px solid var(--border);}.regex-slash{font-size:1.375rem;font-weight:300;color:var(--muted);padding:0 4px 0 20px;display:flex;align-items:center;user-select:none;flex-shrink:0;}#regexInput{flex:1;font-family:'JetBrains Mono','Fira Mono','Courier New',monospace;font-size:1rem;font-weight:500;color:var(--royal);background:transparent;border:none;outline:none;padding:18px 8px;min-width:0;}#regexInput::placeholder{color:rgba(13,33,161,.3);}.flags-area{display:flex;align-items:center;gap:0;padding:0 16px 0 4px;border-left:1px solid var(--border);flex-shrink:0;}.flag-btn{font-family:'JetBrains Mono',monospace;font-size:.8rem;font-weight:600;color:var(--muted);background:transparent;border:none;cursor:pointer;padding:6px 7px;border-radius:6px;transition:background var(--transition),color var(--transition);letter-spacing:0;}.flag-btn:hover{background:rgba(13,33,161,.06);color:var(--royal);}.flag-btn.active{background:rgba(13,33,161,.1);color:var(--royal);}.test-area-wrapper{position:relative;border-bottom:1px solid var(--border);}.area-label{position:absolute;top:14px;left:20px;font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);pointer-events:none;z-index:2;}#highlightLayer{position:absolute;inset:0;padding:36px 20px 16px;font-family:var(--font);font-size:.9375rem;line-height:1.6;white-space:pre-wrap;word-break:break-word;overflow:hidden;pointer-events:none;color:transparent;z-index:1;}mark.rx-match{background:var(--tuscan);color:transparent;border-radius:3px;padding:1px 0;}mark.rx-match-group{background:rgba(13,33,161,.15);color:transparent;border-radius:2px;}#testInput{position:relative;z-index:2;width:100%;min-height:140px;font-family:var(--font);font-size:.9375rem;line-height:1.6;color:var(--onyx);background:transparent;border:none;outline:none;resize:vertical;padding:36px 20px 16px;white-space:pre-wrap;word-break:break-word;caret-color:var(--royal);}#testInput::placeholder{color:var(--muted);}.status-bar{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;background:var(--bg);border-bottom:1px solid var(--border);min-height:40px;flex-wrap:wrap;gap:8px;}.status-text{font-size:.8125rem;font-weight:500;}.status-ok{color:#16a34a;}.status-err{color:#dc2626;}.status-idle{color:var(--muted);}.match-count{font-size:.75rem;font-weight:600;color:var(--muted);}.match-count .count-num{color:var(--royal);font-size:.875rem;}.matches-section{padding:0;}.matches-header{padding:14px 20px 10px;font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);border-bottom:1px solid var(--border);}#matchList{padding:12px 16px;display:flex;flex-direction:column;gap:6px;max-height:220px;overflow-y:auto;}.match-item{display:flex;align-items:flex-start;gap:10px;padding:8px 12px;border-radius:var(--radius);background:var(--bg);border:1px solid var(--border);transition:border-color var(--transition);}.match-item:hover{border-color:var(--tuscan);}.match-idx{font-size:.7rem;font-weight:700;color:rgba(13,33,161,.7);min-width:20px;padding-top:1px;}.match-val{font-family:'JetBrains Mono',monospace;font-size:.8125rem;color:var(--onyx);word-break:break-all;flex:1;}.match-pos{font-size:.7rem;color:var(--muted);flex-shrink:0;padding-top:2px;}.match-groups{margin-top:4px;display:flex;flex-wrap:wrap;gap:4px;}.match-group-tag{font-family:'JetBrains Mono',monospace;font-size:.65rem;background:rgba(13,33,161,.08);color:var(--royal);padding:2px 6px;border-radius:4px;}.no-matches{text-align:center;color:var(--muted);font-size:.875rem;padding:20px;}.replace-row{display:flex;align-items:center;border-bottom:1px solid var(--border);padding:0;}.replace-label{font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);padding:0 8px 0 20px;white-space:nowrap;flex-shrink:0;}#replaceInput{flex:1;font-family:'JetBrains Mono',monospace;font-size:.9rem;color:var(--onyx);background:transparent;border:none;outline:none;padding:14px 8px;min-width:0;}.btn-replace{font-family:var(--font);font-size:.8125rem;font-weight:600;color:#fff;background:var(--royal);border:none;cursor:pointer;padding:0 20px;height:100%;min-height:46px;transition:background var(--transition);flex-shrink:0;letter-spacing:.01em;}.btn-replace:hover{background:var(--prussian);}.replace-result-wrapper{padding:14px 20px;border-bottom:1px solid var(--border);background:rgba(238,198,67,.08);display:none;}.replace-result-wrapper.visible{display:block;}.replace-result-label{font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);margin-bottom:8px;}#replaceResult{font-family:'JetBrains Mono',monospace;font-size:.85rem;color:var(--onyx);white-space:pre-wrap;word-break:break-word;line-height:1.6;}.snippets-section{padding:20px;border-bottom:1px solid var(--border);}.snippets-title{font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:12px;}.snippets-grid{display:flex;flex-wrap:wrap;gap:7px;}.snippet-btn{font-family:'JetBrains Mono',monospace;font-size:.75rem;color:var(--royal);background:rgba(13,33,161,.05);border:1px solid rgba(13,33,161,.12);border-radius:6px;padding:5px 10px;cursor:pointer;transition:background var(--transition),border-color var(--transition);white-space:nowrap;}.snippet-btn:hover{background:rgba(13,33,161,.12);border-color:var(--royal);}.reference-section{margin-top:48px;}.ref-title{font-size:1.25rem;font-weight:700;letter-spacing:-.02em;margin-bottom:20px;}.ref-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;}.ref-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px 18px;}.ref-card-title{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--royal);margin-bottom:10px;}.ref-table{width:100%;border-collapse:collapse;}.ref-table tr + tr td{border-top:1px solid var(--border);}.ref-table td{padding:5px 0;font-size:.8125rem;vertical-align:top;}.ref-table td:first-child{font-family:'JetBrains Mono',monospace;font-size:.8rem;color:var(--royal);font-weight:600;padding-right:12px;white-space:nowrap;}.ref-table td:last-child{color:#374151;}.regex-row.has-error #regexInput{color:#dc2626;}#matchList::-webkit-scrollbar{width:4px;}#matchList::-webkit-scrollbar-track{background:transparent;}#matchList::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px;}@media (max-width:600px){.flag-btn{padding:6px 5px;font-size:.75rem;}.ref-grid{grid-template-columns:1fr;}.regex-slash{padding-left:12px;}.flags-area{padding:0 8px 0 2px;}.replace-label{padding-left:12px;}.btn-replace{padding:0 14px;}}