html,body{margin:0;padding:0;height:100%}body{font-family:IBM Plex Sans,-apple-system,BlinkMacSystemFont,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}:root{color-scheme:dark;--bg: #1a1816;--bg-2: #221f1c;--bg-3: #110f0d;--ink: #e8e2d4;--ink-2: #948b7f;--ink-3: #5d564c;--rule: #2a2622;--rule-2: #3d3630;--accent: #d49a54;--accent-2: rgba(212, 154, 84, .12);--err: #d05656;--mono: "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;--serif: "IBM Plex Serif", Georgia, serif}body{background:var(--bg);color:var(--ink);font-size:14px;line-height:1.5}#root{height:100vh}.home-page{display:flex;flex-direction:column;height:100vh;overflow:hidden}.app-header{display:flex;align-items:baseline;gap:.875rem;padding:.875rem 1.5rem;border-bottom:1px solid var(--rule)}.app-header h1{margin:0;font-size:1.125rem;font-weight:500;letter-spacing:-.005em;color:var(--ink)}.app-header h1 em{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--accent);letter-spacing:-.01em}.app-tagline{color:var(--ink-3);font-family:var(--mono);font-size:.75rem}.app-tagline:before{content:"·";margin-right:.625rem;color:var(--rule-2)}.main-content{flex:1;display:flex;flex-direction:column;padding:1rem 1.5rem 1.25rem;gap:.875rem;min-height:0}.examples-btn{margin-left:auto;padding:.2rem .6rem;background:transparent;color:var(--ink-3);border:1px solid var(--rule-2);border-radius:3px;font:inherit;font-size:.75rem;cursor:pointer;align-self:center}.examples-btn:hover{color:var(--ink);border-color:var(--accent)}.pattern-toolbar{display:flex;justify-content:space-between;align-items:center;padding:.25rem 0 .6rem;border-bottom:1px solid var(--rule)}.toolbar-stats{font-family:var(--mono);font-size:.6875rem;color:var(--ink-3);letter-spacing:.02em}.toolbar-left{display:flex;align-items:center;gap:1.5rem}.toolbar-group{display:flex;align-items:center;gap:.5rem}.toolbar-label{font-size:.6875rem;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-2)}.toolbar-select{padding:.25rem .5rem;background:var(--bg-2);color:var(--ink);border:1px solid var(--rule-2);border-radius:3px;font:inherit;font-size:.8125rem}.toolbar-select:focus{outline:none;border-color:var(--accent)}.toolbar-select option{background:var(--bg-2);color:var(--ink)}.toolbar-checkbox{display:flex;align-items:center;gap:.45rem;font-size:.8125rem;color:var(--ink-2);cursor:pointer;-webkit-user-select:none;user-select:none}.toolbar-checkbox input{accent-color:var(--accent);cursor:pointer}.custom-delimiter-input{width:3.25rem;padding:.25rem .4rem;background:var(--bg-2);color:var(--ink);border:1px solid var(--rule-2);border-radius:3px;font-family:var(--mono);font-size:.8125rem}.custom-delimiter-input:focus{outline:none;border-color:var(--accent)}.workspace{flex:1;display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:1rem;min-height:0}.workspace-left,.workspace-center,.workspace-right{display:flex;flex-direction:column;min-height:0}.input-area,.output-area{flex:1;display:flex;flex-direction:column;min-height:0}.pattern-editor{display:flex;flex-direction:column}.area-label{font-size:.6875rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-2);margin:0 0 .5rem}.area-textarea,.pattern-textarea{flex:1;width:100%;padding:.875rem 1rem;background:var(--bg-2);color:var(--ink);border:1px solid var(--rule);border-radius:4px;font-family:var(--mono);font-size:.8125rem;line-height:1.6;resize:none;font-feature-settings:"liga" 0,"calt" 0}.pattern-textarea{flex:none}.area-textarea:focus,.pattern-textarea:focus{outline:none;border-color:var(--accent)}.area-textarea::placeholder,.pattern-textarea::placeholder{color:var(--ink-2)}.output-textarea{background:var(--bg-3);color:var(--ink)}.has-error{border-color:var(--err)!important}.pattern-help{margin-top:.45rem;font-family:var(--mono);font-size:.6875rem;color:var(--ink-3);display:flex;flex-wrap:wrap;gap:0 .875rem;line-height:1.7}.help-item code{color:var(--ink-2);background:none;padding:0;margin-right:.2rem}.pattern-errors{margin-top:.4rem}.error-message{color:var(--err);font-family:var(--mono);font-size:.75rem;padding:.15rem 0}.warning-message{color:var(--err);font-family:var(--mono);font-size:.75rem;padding:.15rem 0;opacity:.85}.output-header{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.5rem}.output-header .area-label{margin-bottom:0}.output-actions{display:flex;gap:.4rem}.output-action-btn{padding:.2rem .55rem;background:transparent;color:var(--ink-2);border:1px solid var(--rule-2);border-radius:3px;font:inherit;font-size:.6875rem;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}.output-action-btn:hover:not(:disabled){color:var(--ink);border-color:var(--accent)}.output-action-btn:disabled{opacity:.4;cursor:not-allowed}.input-area.drag-over .area-textarea{border-color:var(--accent);background:color-mix(in srgb,var(--bg-2) 90%,var(--accent))}.drag-hint{color:var(--accent);font-weight:400;text-transform:none;letter-spacing:0}.header-hint{color:var(--accent);opacity:.8}.ac-dropdown{position:fixed;z-index:1000;background:var(--bg-2);border:1px solid var(--rule-2);border-radius:4px;box-shadow:0 12px 32px #00000073;min-width:260px;max-height:280px;overflow-y:auto;padding:.25rem}.ac-item{display:flex;align-items:baseline;gap:.75rem;padding:.35rem .55rem;border-radius:3px;cursor:pointer}.ac-item-selected{background:var(--accent-2)}.ac-label{font-family:var(--mono);font-size:.8125rem;color:var(--ink);white-space:nowrap}.ac-desc{font-size:.6875rem;color:var(--ink-3);margin-left:auto;white-space:nowrap}.area-textarea,.pattern-textarea,.ac-dropdown{scrollbar-width:thin;scrollbar-color:var(--rule-2) transparent}.area-textarea::-webkit-scrollbar,.pattern-textarea::-webkit-scrollbar,.ac-dropdown::-webkit-scrollbar{width:8px;height:8px}.area-textarea::-webkit-scrollbar-thumb,.pattern-textarea::-webkit-scrollbar-thumb,.ac-dropdown::-webkit-scrollbar-thumb{background:var(--rule-2);border-radius:4px}::selection{background:var(--accent-2);color:var(--ink)}@media(max-width:1024px){.workspace{grid-template-columns:1fr;grid-template-rows:1fr auto 1fr}}.sheet-overlay{position:fixed;inset:0;background:#00000073;z-index:200}.sheet{position:fixed;top:0;right:0;bottom:0;width:420px;max-width:100vw;background:var(--bg-2);border-left:1px solid var(--rule-2);z-index:201;display:flex;flex-direction:column;overflow:hidden}.sheet-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;border-bottom:1px solid var(--rule);flex-shrink:0}.sheet-title{font-size:.8125rem;font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2)}.sheet-close{background:none;border:none;color:var(--ink-3);font-size:1.25rem;line-height:1;cursor:pointer;padding:.1rem .3rem}.sheet-close:hover{color:var(--ink)}.sheet-body{overflow-y:auto;flex:1;padding:.5rem 0;scrollbar-width:thin;scrollbar-color:var(--rule-2) transparent}.example-card{padding:1rem 1.25rem;border-bottom:1px solid var(--rule)}.example-card:last-child{border-bottom:none}.example-card-header{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.3rem}.example-title{font-size:.875rem;font-weight:500;color:var(--ink)}.example-desc{margin:0 0 .75rem;font-size:.75rem;color:var(--ink-3);line-height:1.55}.example-preview{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-bottom:0}.example-preview-label{font-size:.625rem;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-3);margin-bottom:.3rem}.example-pre{margin:0;font-family:var(--mono);font-size:.6875rem;line-height:1.55;color:var(--ink-2);white-space:pre-wrap;word-break:break-all;max-height:72px;overflow:hidden;background:var(--bg-3);padding:.4rem .5rem;border-radius:3px}.example-load{padding:.2rem .55rem;background:transparent;color:var(--accent);border:1px solid var(--accent);border-radius:3px;font:inherit;font-size:.6875rem;letter-spacing:.06em;cursor:pointer;flex-shrink:0}.example-load:hover{background:var(--accent-2)}.pattern-editor-wrap{position:relative;flex:none}.pattern-highlight{position:absolute;inset:0;pointer-events:none;overflow:hidden;padding:.875rem 1rem;font-family:var(--mono);font-size:.8125rem;line-height:1.6;border:1px solid transparent;border-radius:4px;white-space:pre-wrap;word-break:break-word;color:var(--ink);font-feature-settings:"liga" 0,"calt" 0;box-sizing:border-box}.hl-token{color:var(--accent)}.hl-token-err{color:var(--err)}.pattern-textarea.has-overlay{color:transparent;caret-color:var(--ink);background:transparent;position:relative}.input-area-body{flex:1;position:relative;display:flex;flex-direction:column;min-height:0}.input-col-highlight{position:absolute;inset:0;pointer-events:none;overflow:hidden;padding:.875rem 1rem;font-family:var(--mono);font-size:.8125rem;line-height:1.6;border:1px solid transparent;border-radius:4px;white-space:pre-wrap;word-break:break-word;color:transparent;font-feature-settings:"liga" 0,"calt" 0;box-sizing:border-box}.hl-col{background:#d49a542e;border-radius:2px;color:transparent}.area-textarea.has-overlay{color:transparent;caret-color:var(--ink);background:transparent;position:relative;flex:1}