.wt-regex{--rx:#7c3aed;--rx2:#a855f7;--ink:#172033;--muted:#667085;--line:#e6e8ee;--soft:#f7f5ff;max-width:1440px;margin:0 auto;padding:24px 18px 56px;font-family:inherit;color:var(--ink)}
.wt-regex *{box-sizing:border-box}.wt-regex button,.wt-regex input,.wt-regex textarea,.wt-regex select{font:inherit}.wt-regex button{cursor:pointer}
.wt-regex-hero{padding:26px 28px;border:1px solid #e7e1fb;border-radius:24px;background:linear-gradient(135deg,#fff 0,#faf8ff 52%,#f0eaff 100%);box-shadow:0 16px 46px rgba(48,32,96,.08);margin-bottom:18px}.wt-regex-hero h1{font-size:clamp(28px,4vw,46px);margin:8px 0}.wt-regex-hero p{max-width:900px;color:var(--muted);line-height:1.9;margin:0}.wt-back{display:inline-flex;text-decoration:none;color:#5d35a9;font-weight:700;margin-bottom:10px}.wt-kicker{font:700 12px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;color:#7c3aed;letter-spacing:.08em}.wt-regex-badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.wt-regex-badges span{padding:7px 10px;border:1px solid #ded4fb;border-radius:999px;background:#fff;color:#5d35a9;font-size:12px;font-weight:700}
.wt-regex-patternbar{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:10px;align-items:center;margin:16px 0}.wt-regex-patternbox{direction:ltr;display:flex;align-items:center;border:1px solid #d8dce5;background:#101521;border-radius:14px;padding:0 12px;min-height:52px;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}.wt-regex-patternbox input{border:0!important;background:transparent!important;color:#f8fafc!important;outline:0!important;box-shadow:none!important}.wt-regex-patternbox #wtRegexPattern{flex:1;min-width:0;padding:12px 4px}.wt-regex-patternbox .wt-regex-flags-text{width:65px;color:#c4b5fd!important}.wt-regex-slash{color:#8b93a5;font:700 22px ui-monospace,monospace}.wt-btn{border:1px solid #d9dde7;background:#fff;border-radius:12px;padding:11px 15px;color:#344054;font-weight:700}.wt-btn:hover{border-color:#baaaf0}.wt-btn-primary{background:var(--rx);border-color:var(--rx);color:#fff}.wt-btn kbd{font-size:10px;opacity:.75;margin-inline-start:6px}
.wt-regex-flags{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}.wt-regex-flags label{display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;column-gap:7px;align-items:center;padding:8px 11px;border:1px solid #e2e5eb;border-radius:12px;background:#fff;min-width:92px}.wt-regex-flags input{grid-row:1/3}.wt-regex-flags strong{direction:ltr;color:#5b21b6}.wt-regex-flags span{font-size:10px;color:#8b92a0}
.wt-regex-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(300px,.7fr);gap:16px;align-items:start}.wt-regex-main{min-width:0}.wt-regex-side{display:grid;gap:12px;position:sticky;top:92px;max-height:calc(100vh - 112px);overflow:auto;padding-inline-end:2px}.wt-regex-editor-card,.wt-regex-result-card,.wt-regex-card{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 10px 30px rgba(17,24,39,.05)}.wt-regex-editor-card,.wt-regex-result-card{padding:16px}.wt-regex-card{padding:15px}.wt-regex-head,.wt-regex-cardhead{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.wt-regex-head>div:first-child{display:grid;grid-template-columns:auto auto;column-gap:8px;align-items:center}.wt-regex-head h2{margin:0;font-size:17px}.wt-regex-head p{grid-column:1/3;color:var(--muted);font-size:12px;margin:4px 0 0}.wt-step{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:9px;background:#f0eaff;color:#6d28d9;font:700 11px ui-monospace,monospace}.wt-regex-actions{display:flex;align-items:center;gap:8px;color:#888;font-size:11px}.wt-regex-actions button{border:0;background:#f4f5f7;border-radius:9px;padding:7px 10px;color:#475467}.wt-regex textarea{width:100%;min-height:300px;resize:vertical;border:1px solid #dfe3ea;border-radius:13px;padding:14px;outline:0;background:#fbfcfe;color:#1d2939;font:14px/1.9 ui-monospace,SFMono-Regular,Consolas,monospace;direction:auto}.wt-regex textarea:focus{border-color:#aa8ee8;box-shadow:0 0 0 3px rgba(124,58,237,.08)}
.wt-regex-modebar{display:flex;gap:6px;margin:12px 0;padding:5px;background:#f1f3f7;border-radius:13px;width:max-content}.wt-regex-modebar button{border:0;background:transparent;padding:8px 15px;border-radius:9px;color:#667085;font-weight:700}.wt-regex-modebar button.is-active{background:#fff;color:#5b21b6;box-shadow:0 2px 8px rgba(0,0,0,.06)}.wt-regex-replacebar{display:flex;gap:10px;align-items:end;margin-bottom:12px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px}.wt-regex-replacebar label{flex:1;font-size:12px;color:#667085}.wt-regex-replacebar input{display:block;width:100%;margin-top:6px;border:1px solid #dfe3ea;border-radius:10px;padding:10px;direction:auto}
.wt-regex-result-card{min-height:340px}.wt-regex-status{padding:6px 10px;border-radius:999px;background:#f2f4f7;color:#667085;font-size:11px;font-weight:800}.wt-regex-status[data-status="ok"]{background:#ecfdf3;color:#067647}.wt-regex-status[data-status="error"]{background:#fef3f2;color:#b42318}.wt-regex-status[data-status="warn"]{background:#fffaeb;color:#b54708}.wt-regex-output{display:grid;gap:9px}.wt-regex-empty{padding:36px;text-align:center;border:1px dashed #d9dde7;border-radius:13px;color:#98a2b3}.wt-regex-match{border:1px solid #e5e7eb;border-radius:13px;overflow:hidden}.wt-regex-matchtop{display:flex;gap:10px;align-items:center;padding:10px 12px;background:#fafafa;border-bottom:1px solid #eee}.wt-regex-matchtop strong{font:700 12px ui-monospace,monospace;color:#6d28d9}.wt-regex-matchtop code{direction:ltr;unicode-bidi:plaintext;white-space:pre-wrap;word-break:break-word}.wt-regex-matchpos{margin-inline-start:auto;font-size:10px;color:#98a2b3}.wt-regex-groups{display:grid;grid-template-columns:minmax(90px,.35fr) 1fr;font-size:12px}.wt-regex-groups span,.wt-regex-groups code{padding:8px 10px;border-top:1px solid #f0f1f3}.wt-regex-groups span{color:#667085}.wt-regex-groups code{direction:ltr;unicode-bidi:plaintext;word-break:break-all;background:#fcfcfd}.wt-regex-textresult{width:100%;min-height:260px;border:0;background:#101521;color:#e5e7eb;border-radius:13px;padding:14px;direction:auto;font:13px/1.8 ui-monospace,monospace;white-space:pre-wrap;overflow:auto}.wt-regex-splititem{display:grid;grid-template-columns:auto 1fr;gap:10px;border-bottom:1px solid #eee;padding:9px}.wt-regex-splititem strong{color:#7c3aed}.wt-regex-splititem code{direction:ltr;unicode-bidi:plaintext;word-break:break-word}
.wt-regex-card h3{margin:0 0 11px;font-size:14px}.wt-regex-statgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.wt-regex-statgrid div{background:#f8f7fc;border-radius:11px;padding:10px;text-align:center}.wt-regex-statgrid strong{display:block;font:800 20px ui-monospace,monospace;color:#4c1d95}.wt-regex-statgrid span{font-size:10px;color:#8a91a0}.wt-regex-cardhead{align-items:center}.wt-regex-cardhead h3{margin:0}.wt-regex-cardhead strong{font:800 20px ui-monospace,monospace;color:#5b21b6}.wt-regex-healthbar{height:7px;background:#eee;border-radius:99px;overflow:hidden;margin-bottom:10px}.wt-regex-healthbar span{display:block;height:100%;width:100%;background:linear-gradient(90deg,#22c55e,#84cc16);transition:width .2s}.wt-regex-healthlist,.wt-regex-explain{display:grid;gap:7px;color:#667085;font-size:11px;line-height:1.65}.wt-regex-healthlist p,.wt-regex-explain p{margin:0}.wt-regex-healthitem{padding:8px 9px;border-radius:9px;background:#f8fafc}.wt-regex-healthitem.warn{background:#fffaeb;color:#92400e}.wt-regex-healthitem.bad{background:#fff1f2;color:#9f1239}.wt-regex-token{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:start;padding:7px 0;border-bottom:1px solid #f0f1f3}.wt-regex-token code{direction:ltr;color:#6d28d9;font-weight:700}.wt-regex-card select{width:100%;border:1px solid #dfe3ea;border-radius:10px;padding:9px;background:#fff}.wt-regex-card small{display:block;color:#98a2b3;line-height:1.6;margin-top:8px}.wt-regex-cheats{display:grid;grid-template-columns:auto 1fr;gap:5px 10px;font-size:11px;align-items:center}.wt-regex-cheats code{direction:ltr;background:#f1edff;color:#5b21b6;padding:3px 6px;border-radius:6px}.wt-regex-cheats span{color:#667085}.wt-regex-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px}.wt-regex-notes article{border:1px solid var(--line);background:#fff;border-radius:15px;padding:14px}.wt-regex-notes strong{font-size:13px}.wt-regex-notes p{font-size:11px;color:#667085;line-height:1.7;margin:6px 0 0}
@media(max-width:980px){.wt-regex-layout{grid-template-columns:1fr}.wt-regex-side{position:static;max-height:none;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible}.wt-regex-patternbar{grid-template-columns:1fr auto auto}.wt-regex-patternbox{grid-column:1/-1}.wt-regex-notes{grid-template-columns:1fr}.wt-regex textarea{min-height:230px}}
@media(max-width:640px){.wt-regex{padding-inline:10px}.wt-regex-hero{padding:20px 16px}.wt-regex-patternbar{grid-template-columns:1fr 1fr}.wt-regex-patternbar .wt-btn-primary{grid-column:1/-1}.wt-regex-side{grid-template-columns:1fr}.wt-regex-flags label{min-width:auto;flex:1}.wt-regex-replacebar{align-items:stretch;flex-direction:column}.wt-regex-groups{grid-template-columns:1fr}.wt-regex-groups span{padding-bottom:2px}.wt-regex-groups code{padding-top:2px}.wt-regex-modebar{width:100%}.wt-regex-modebar button{flex:1}.wt-regex-patternbox .wt-regex-flags-text{width:48px}}