.main-content{display:flex;flex-direction:column;gap:20px;margin-bottom:30px}.regex-section,.test-section,.results-section{background:var(--bg-light);border-radius:10px;padding:20px;box-shadow:0 10px 30px #0000001a}.regex-section h2,.test-section h2,.results-section h2{margin-bottom:15px;color:var(--text-primary);font-size:18px}.regex-input-wrapper{display:flex;align-items:center;gap:5px;background-color:var(--bg-editor);border:2px solid var(--border-color);border-radius:8px;padding:10px 15px;transition:border-color .3s}.regex-input-wrapper:focus-within{border-color:var(--border-focus)}.regex-delimiter{color:var(--border-focus);font-family:Courier New,monospace;font-size:20px;font-weight:700}#regex-pattern{flex:1;border:0;background:0 0;font-family:Courier New,monospace;font-size:16px;color:var(--text-editor);outline:0}.flags-input{width:80px;border:0;background:0 0;font-family:Courier New,monospace;font-size:16px;color:var(--border-focus);outline:0;text-align:center}.flags-help{margin-top:15px;padding:12px;background:#667eea0d;border-radius:6px}.flags-help label:first-child{display:block;margin-bottom:8px;color:var(--text-primary);font-weight:600}.flag-checkboxes{display:flex;flex-wrap:wrap;gap:15px}.flag-checkboxes label{display:flex;align-items:center;gap:5px;color:var(--text-secondary);font-size:14px;cursor:pointer}.flag-checkbox{cursor:pointer}.test-text-wrapper{position:relative;width:100%;border:2px solid var(--border-color);border-radius:8px}#highlighted-backdrop{position:absolute;top:0;left:0;width:100%;height:100%;padding:15px;border-radius:8px;font-family:Courier New,monospace;font-size:14px;line-height:1.5;white-space:pre-wrap;word-wrap:break-word;overflow:auto;pointer-events:none;color:var(--text-editor);background-color:var(--bg-editor)}#test-string{position:relative;width:100%;height:200px;background:0 0;padding:15px;border:0;border-radius:8px;font-family:Courier New,monospace;font-size:14px;resize:vertical;color:var(--text-editor);line-height:1.5;overflow:auto}#test-string:focus{outline:0}.test-text-wrapper:focus-within{border-color:var(--border-focus)}textarea:focus{outline:0;border-color:var(--border-focus)}.button-group{display:flex;gap:10px;margin-top:15px;flex-wrap:wrap}button{padding:10px 20px;border:0;border-radius:6px;font-weight:600;cursor:pointer;transition:all .3s;font-size:14px}.btn-tertiary{background:0 0;color:var(--text-primary);border:1px solid var(--border-color)}.btn-tertiary:hover{background:#667eea1a;border-color:var(--border-focus)}body.dark-theme .btn-tertiary{border-color:#555}body.dark-theme .btn-tertiary:hover{background:#667eea33;border-color:var(--border-focus)}.message{padding:12px;border-radius:6px;margin-top:15px;font-weight:500;display:none}.message.show{display:block}.message.success{background:#d4edda;color:#155724;border:1px solid #c3e6cb}.message.error{background:#f8d7da;color:#721c24;border:1px solid #f5c6cb}.match-info{padding:10px;background:#667eea1a;border-radius:6px;margin-bottom:15px;color:var(--text-primary);font-weight:500}.matches-container{display:flex;flex-direction:column;gap:10px;max-height:400px;overflow-y:auto}.match-item{padding:15px;background:var(--bg-editor);border-left:4px solid var(--border-focus);border-radius:6px}.match-index{font-weight:700;color:var(--border-focus);margin-bottom:8px}.match-text{font-family:Courier New,monospace;background:#667eea1a;padding:8px;border-radius:4px;margin-bottom:8px;color:var(--text-editor);word-break:break-all}.match-details{font-size:12px;color:var(--text-secondary);font-family:Courier New,monospace}.capture-groups{margin-top:8px;padding-top:8px;border-top:1px solid var(--border-color)}.capture-group{font-size:13px;color:var(--text-secondary);padding:4px 0}.highlighted-text{white-space:pre-wrap;word-break:break-word}.highlight{background-color:#ffeb3bb3;color:inherit;border-radius:2px;padding:0}body.dark-theme .highlight{background-color:#ff980066;color:#fff}@media (max-width:768px){textarea{height:150px}.flag-checkboxes{flex-direction:column;gap:8px}.matches-container{max-height:300px}}