@layer theme{:root,:host{--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring:where(:not(iframe)){outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.contents{display:contents}.flex{display:flex}.\[mail\:\$\&\]{mail:$&}}:root{--accent-h:287;--accent-s:72%;--accent-l:48%;--font-sans:ui-sans-serif, system-ui, "Segoe UI", Helvetica, Arial, sans-serif;--font-mono:ui-monospace, "SFMono-Regular", "Cascadia Code", "Roboto Mono", Menlo, Consolas, monospace;--radius:.5rem;--ease:.16s cubic-bezier(.2, .7, .2, 1)}[data-theme=light]{color-scheme:light dark;--bg:#f6f7f9;--bg-elev:#fff;--fg:#14181f;--mute:#5e636e;--line:#d8dadf;--accent:hsl(var(--accent-h) var(--accent-s) var(--accent-l));--accent-fg:#fff;--accent-soft:hsl(var(--accent-h) var(--accent-s) var(--accent-l) / .16);--danger:#c12a1f;--ok:#297a52;--warn:#cb850b;--shadow:0 1px 2px #14181f0f}[data-theme=dark]{color-scheme:light dark;--bg:#14161a;--bg-elev:#1d2025;--fg:#eeeff2;--mute:#9ca1ab;--line:#32363e;--accent:hsl(var(--accent-h) calc(var(--accent-s) - 4%) 62%);--accent-fg:#14181f;--accent-soft:hsl(var(--accent-h) 70% 62% / .22);--danger:#e2635a;--ok:#54b685;--warn:#efa92e;--shadow:0 1px 2px #0006}@media(prefers-reduced-motion:reduce){:root{--ease:0s}}:root{--radius:.25rem}[data-theme=light]{--input-bg:hsl(var(--accent-h) 14% 13%);--input-fg:hsl(var(--accent-h) 12% 94%);--input-mute:hsl(var(--accent-h) 10% 70%);--input-line:hsl(var(--accent-h) 10% 24%);--output-bg:hsl(var(--accent-h) 24% 98%);--output-fg:hsl(var(--accent-h) 16% 12%);--output-mute:hsl(var(--accent-h) 8% 42%);--output-line:hsl(var(--accent-h) 12% 88%);--gutter:hsl(var(--accent-h) 10% 55%);--match-a:hsl(var(--accent-h) 78% 82%);--match-b:hsl(calc(var(--accent-h) + 42) 62% 82%);--group-fill:hsl(var(--accent-h) 40% 92%);--empty:#fce8c5;--absent:#e3e5e8}[data-theme=dark]{--input-bg:hsl(var(--accent-h) 16% 6%);--input-fg:hsl(var(--accent-h) 10% 94%);--input-mute:hsl(var(--accent-h) 8% 62%);--input-line:hsl(var(--accent-h) 10% 16%);--output-bg:hsl(var(--accent-h) 12% 16%);--output-fg:hsl(var(--accent-h) 10% 92%);--output-mute:hsl(var(--accent-h) 8% 68%);--output-line:hsl(var(--accent-h) 10% 26%);--gutter:hsl(var(--accent-h) 8% 46%);--match-a:hsl(var(--accent-h) 48% 28%);--match-b:hsl(calc(var(--accent-h) + 42) 40% 26%);--group-fill:hsl(var(--accent-h) 36% 22%);--empty:#4f3e22;--absent:#2a2d32}html{color-scheme:light dark}html,body,#root{background:var(--bg);height:100%;min-height:100%;color:var(--fg);font-family:var(--font-sans);margin:0;font-size:13px}*{box-sizing:border-box}button,input,textarea,select{font:inherit}:focus-visible{outline:2px solid var(--fg);outline-offset:2px}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.app{flex-direction:column;min-width:360px;height:100dvh;min-height:100dvh;display:flex}.top-strip{border-bottom:1px solid var(--line);background:var(--bg-elev);flex-shrink:0;justify-content:space-between;align-items:center;gap:.75rem;height:2.5rem;padding:0 .75rem;display:flex}.brand{letter-spacing:.04em;text-transform:uppercase;margin:0;font-size:.8rem;font-weight:650}.primary-action{appearance:none;border-radius:var(--radius);background:var(--accent);color:var(--accent-fg);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;border:0;min-height:1.85rem;padding:0 .7rem;font-size:.72rem;font-weight:650}.primary-action:hover{filter:brightness(1.06)}.theme-toggle{border:1px solid var(--line);border-radius:var(--radius);display:inline-flex;overflow:hidden}.theme-toggle button{appearance:none;color:var(--mute);letter-spacing:.04em;text-transform:uppercase;cursor:pointer;background:0 0;border:0;min-height:1.85rem;padding:0 .5rem;font-size:.68rem}.theme-toggle button[aria-pressed=true]{background:var(--bg);color:var(--fg)}.split{flex:1;min-height:0;display:flex}.pane{flex-direction:column;min-width:0;min-height:0;display:flex;overflow:hidden}.input-pane{background:var(--input-bg);color:var(--input-fg)}.output-pane{background:var(--output-bg);color:var(--output-fg)}.divider{cursor:col-resize;background:var(--line);flex:0 0 6px;width:6px;position:relative}.divider:after{content:"";position:absolute;inset:0 -4px}.pane-body{flex:1;min-height:0;padding:.5rem .6rem .75rem;overflow:auto}.pane-section+.pane-section{margin-top:.65rem}.label{letter-spacing:.12em;text-transform:uppercase;color:var(--mute);margin:0 0 .28rem;font-size:.65rem;font-weight:650}.input-pane .label,.input-pane .note{color:var(--input-mute)}.output-pane .label{color:var(--output-mute)}.flags{flex-wrap:wrap;gap:.28rem;margin:.35rem 0 .45rem;display:flex}.flag{appearance:none;border:1px solid var(--input-line);color:var(--input-fg);border-radius:var(--radius);min-width:1.7rem;min-height:1.7rem;font-family:var(--font-mono);cursor:pointer;background:0 0;padding:0 .35rem;font-size:.78rem;position:relative}.flag[aria-pressed=true]{background:var(--input-fg)}@supports (color:color-mix(in lab,red,red)){.flag[aria-pressed=true]{background:color-mix(in srgb,var(--input-fg) 14%,transparent)}}.flag:hover .flag-tip,.flag:focus-visible .flag-tip{opacity:1;pointer-events:none}.flag-tip{z-index:5;background:var(--bg-elev);width:max-content;max-width:16rem;color:var(--fg);border:1px solid var(--line);border-radius:var(--radius);font-family:var(--font-sans);letter-spacing:0;text-transform:none;opacity:0;box-shadow:var(--shadow);padding:.28rem .4rem;font-size:.72rem;position:absolute;top:calc(100% + 4px);left:50%;transform:translate(-50%)}.pattern-wrap,.hero-wrap{font-family:var(--font-mono);font-size:.84rem;line-height:1.45;position:relative}.pattern-wrap{min-height:3.4rem}.pattern-hl{white-space:pre-wrap;word-break:break-all;color:var(--input-fg);margin:0;padding:.4rem .5rem}.pattern-hl .hot{background:var(--accent-soft);outline:1px solid var(--accent)}@supports (color:color-mix(in lab,red,red)){.pattern-hl .hot{outline:1px solid color-mix(in srgb,var(--accent) 55%,transparent)}}.pattern-ta,.hero-ta{resize:none;border:1px solid var(--input-line);border-radius:var(--radius);color:#0000;width:100%;height:100%;caret-color:var(--input-fg);background:0 0;padding:.4rem .5rem;position:absolute;inset:0;overflow:auto}.pattern-ta{min-height:3.4rem}.hero{border:1px solid var(--input-line);border-radius:var(--radius);background:var(--input-bg);min-height:10rem;overflow:hidden}@supports (color:color-mix(in lab,red,red)){.hero{background:color-mix(in srgb,var(--input-bg) 80%,black)}}.hero-grid{grid-template-columns:2.2rem 1fr;min-height:10rem;display:grid}.gutter{text-align:right;color:var(--gutter);font-family:var(--font-mono);-webkit-user-select:none;user-select:none;border-right:1px solid var(--input-line);padding:.45rem .2rem;font-size:.72rem;line-height:1.45}.hero-body{min-height:10rem;position:relative}.hero-hl{white-space:pre-wrap;word-break:break-word;font-family:var(--font-mono);color:var(--input-fg);margin:0;padding:.45rem .5rem;font-size:.92rem;line-height:1.45}.hero-ta{border:0;border-radius:0;padding:.45rem .5rem;font-size:.92rem;line-height:1.45}.hl-a{background:var(--match-a)}.hl-b{background:var(--match-b)}.hl-group{background:var(--group-fill);box-shadow:inset 0 0 0 1px var(--accent)}@supports (color:color-mix(in lab,red,red)){.hl-group{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 35%,transparent)}}.error{color:var(--danger);margin:.35rem 0 0;font-size:.78rem}.warn{color:var(--warn);margin:.35rem 0 0;font-size:.78rem}.stale{opacity:.45}.mono{font-family:var(--font-mono)}.match-card{border:1px solid var(--output-line);border-radius:var(--radius);margin:0 0 .4rem;padding:.4rem .5rem}.match-card[data-hot=true]{outline:1px solid var(--accent)}@supports (color:color-mix(in lab,red,red)){.match-card[data-hot=true]{outline:1px solid color-mix(in srgb,var(--accent) 55%,transparent)}}.meta-row{color:var(--output-mute);flex-wrap:wrap;gap:.45rem .8rem;font-size:.75rem;display:flex}.group-table{border-collapse:collapse;width:100%;margin-top:.3rem;font-size:.75rem}.group-table th,.group-table td{text-align:left;border-bottom:1px solid var(--output-line);vertical-align:top;padding:.18rem .3rem}.group-empty{background:var(--empty);font-style:italic}.group-absent{background:var(--absent);color:var(--output-mute)}.explain-row{text-align:left;width:100%;color:inherit;border-radius:var(--radius);cursor:pointer;background:0 0;border:0;padding:.12rem .25rem;font-size:.78rem;display:block}.explain-row[data-hot=true]{background:var(--accent-soft)}.replace-out{white-space:pre-wrap;word-break:break-word;font-family:var(--font-mono);border:1px solid var(--output-line);border-radius:var(--radius);min-height:4rem;padding:.4rem .5rem;font-size:.8rem}.drawer-backdrop{background:var(--fg);position:fixed;inset:0}@supports (color:color-mix(in lab,red,red)){.drawer-backdrop{background:color-mix(in srgb,var(--fg) 28%,transparent)}}.drawer-backdrop{z-index:20}.drawer{background:var(--bg-elev);width:min(22rem,100vw);height:100dvh;color:var(--fg);z-index:21;box-shadow:var(--shadow);padding:.75rem;position:fixed;top:0;right:0;overflow:auto}.drawer h2{margin:0 0 .5rem;font-size:.9rem}.starter,.cheat-row{text-align:left;border:1px solid var(--line);background:var(--bg);width:100%;color:inherit;border-radius:var(--radius);cursor:pointer;margin:0 0 .35rem;padding:.4rem .5rem}.note{color:var(--mute);margin:.2rem 0 .6rem;font-size:.75rem}.tabs{border-bottom:1px solid var(--line);background:var(--bg-elev);flex-shrink:0;display:none}.tab{appearance:none;color:var(--mute);letter-spacing:.04em;text-transform:uppercase;cursor:pointer;background:0 0;border:0;min-height:2.2rem;padding:0 .55rem;font-size:.72rem}.tab[aria-selected=true]{color:var(--fg);box-shadow:inset 0 -2px 0 var(--accent)}.foot{border-top:1px solid var(--line);background:var(--bg-elev);color:var(--mute);flex-wrap:wrap;flex-shrink:0;justify-content:space-between;align-items:center;gap:.4rem .8rem;padding:.35rem .75rem .5rem;font-size:.7rem;display:flex}.replace-in{border:1px solid var(--output-line);background:var(--bg);width:100%;color:var(--output-fg);border-radius:var(--radius);font-family:var(--font-mono);padding:.35rem .45rem}@media(max-width:899px){.split{display:none}.tabs{display:flex;overflow-x:auto}.mobile-panes{flex:1;min-height:0;display:flex}.mobile-panes .pane{width:100%}}@media(min-width:900px){.tabs,.mobile-panes{display:none}}@media(prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
