@import"https://fonts.googleapis.com/css2?family=Fira+Sans:wght@300;400;500;600;700&display=swap";:root{--color-bg-primary: #ffffff;--color-bg-secondary: #f9fafb;--color-bg-tertiary: #f3f4f6;--color-border: #e5e7eb;--color-border-focus: #3b82f6;--color-text-primary: #111827;--color-text-secondary: #374151;--color-text-tertiary: #6b7280;--color-text-placeholder: #4d5c72;--color-signal-bg: #fef2f2;--color-signal-border: #fecaca;--color-signal-text: #ef4444;--color-signal-hover: #dc2626;--color-button-primary: #3b82f6;--color-button-primary-hover: #2563eb;--color-button-primary-bg: #eff6ff;--color-button-primary-bg-hover: #dbeafe;--color-tooltip-bg: #1f2937;--color-tooltip-text: #ffffff;--color-link: #3b82f6;--color-link-hover: #2563eb;--color-link-visited: #7c3aed;--color-link-active: #1d4ed8;--color-shadow: rgba(0, 0, 0, .05);--color-shadow-hover: rgba(0, 0, 0, .1);--scrollbar-width: .5rem;--scrollbar-track-bg: var(--color-bg-tertiary);--scrollbar-thumb-bg: var(--color-border);--scrollbar-thumb-hover-bg: var(--color-text-tertiary);--scrollbar-border-radius: .25rem}@media (prefers-color-scheme: dark){:root{--color-bg-primary: #0c1016;--color-bg-secondary: #0c1016;--color-bg-tertiary: #152738;--color-border: #1e2e3d;--color-border-focus: #57cbfe;--color-text-primary: #f9fafb;--color-text-secondary: #d1d2d6;--color-text-tertiary: #a9bbda;--color-text-placeholder: #6b7280;--color-signal-bg: #230c0c;--color-signal-border: #991b1b;--color-signal-text: #ff6363;--color-signal-hover: #ef4444;--color-button-primary: #f9fafb;--color-button-primary-hover: #fff;--color-button-primary-bg: #27557a;--color-button-primary-bg-hover: #3586aa;--color-tooltip-bg: #f9fafb;--color-tooltip-text: #111827;--color-link: #60a5fa;--color-link-hover: #93c5fd;--color-link-visited: #a78bfa;--color-link-active: #3b82f6;--color-shadow: rgba(0, 0, 0, .3);--color-shadow-hover: rgba(0, 0, 0, .5);--scrollbar-track-bg: var(--color-bg-secondary);--scrollbar-thumb-bg: var(--color-border);--scrollbar-thumb-hover-bg: var(--color-text-tertiary)}}*,*:before,*:after{box-sizing:border-box}*{margin:0}button{color:inherit}button,[role=button]{cursor:pointer}code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}img,svg{display:block}img,video{max-width:100%;height:auto}a{color:var(--color-link);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px;transition:color .15s ease}a:hover{color:var(--color-link-hover)}a:visited{color:var(--color-link-visited)}a:active{color:var(--color-link-active)}a:focus-visible{outline:2px solid var(--color-border-focus);outline-offset:2px;border-radius:2px}html{line-height:1.5;-webkit-text-size-adjust:100%;font-family:Fira Sans,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";background-color:var(--color-bg-primary);color:var(--color-text-primary)}.app{min-height:100vh;padding:2rem 1rem}.app__container{max-width:60rem;margin:0 auto}.app__header{margin-bottom:2rem}.app__title{font-size:2.25rem;font-weight:700;color:var(--color-text-primary);margin-bottom:.5rem;line-height:1.2}.app__description{color:var(--color-text-secondary);font-size:1rem;line-height:1.5}.output{background-color:transparent;border:none;border-radius:.5rem}.output__section{display:flex;flex-direction:column}.input{display:flex;flex-direction:column;gap:.5rem;border:1px solid var(--color-border);border-radius:0;padding:1rem;background-color:var(--color-bg-secondary);transition:border-color .15s ease}.input__controls-group{display:flex;align-items:flex-end;justify-content:flex-end;gap:.5rem;flex-wrap:wrap}.input__textarea{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.875rem;line-height:1.25;padding:.75rem .5rem;background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-width:0;border-bottom-width:1px;resize:vertical;height:2.75rem;min-height:2.75rem;transition:border-color .15s ease;color:var(--color-text-primary)}.input__textarea:focus{outline:none;border-color:var(--color-border-focus)}.input__textarea:disabled{cursor:not-allowed;opacity:.6}.input__textarea::placeholder{color:var(--color-text-placeholder);opacity:1}.input__hint{font-size:.75rem;color:var(--color-text-tertiary);line-height:1.5}.alternative{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}.alternative__token{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.75rem;min-width:3rem;color:var(--color-text-secondary)}.alternative__bar-container{flex:1;height:1rem;background-color:var(--color-bg-tertiary);border-radius:.25rem;overflow:hidden}.alternative__bar{height:100%;background-color:var(--color-button-primary);transition:width .3s ease}.alternative__percentage{font-size:.75rem;color:var(--color-text-tertiary);min-width:2.5rem;text-align:right;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.icon{display:inline-flex;align-items:center;justify-content:center;width:1em;height:1em;line-height:1;font-style:normal;vertical-align:middle;flex-shrink:0;transition:transform .15s ease}.icon--sm{width:.875em;height:.875em}.icon--md{width:1em;height:1em}.icon--lg{width:1.25em;height:1.25em}.icon--with-text{margin-right:.375rem}.icon svg{width:100%;height:100%;fill:currentColor}.icon--delete:before{content:"✕";font-size:1.1em;font-weight:600}.icon--delete svg{width:100%;height:100%}.icon--regenerate:before{content:"↻";font-size:1.2em;font-weight:600}.icon--regenerate svg{width:100%;height:100%}.icon--delete:has(svg):before,.icon--regenerate:has(svg):before{content:none}.icon--spinning{animation:icon-spin 1s linear infinite}@keyframes icon-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.icon--check:before{content:"✓";font-size:1.2em;font-weight:600}.icon--check svg{width:100%;height:100%}.icon--minus:before{content:"−";font-size:1.2em;font-weight:600}.icon--minus svg{width:100%;height:100%}.icon--check:has(svg):before,.icon--minus:has(svg):before{content:none}button:disabled .icon{opacity:.5}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.375rem .75rem;font-size:.875rem;font-weight:500;border-radius:.375rem;cursor:pointer;transition:all .15s ease;white-space:nowrap;border:1px solid transparent;line-height:1rem;height:2rem}.btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.btn--sm{padding:.25rem .5rem;font-size:.8125rem;height:1.75rem}.btn--md{padding:.375rem .75rem;font-size:.875rem;height:2rem}.btn--lg{padding:.5rem 1rem;font-size:.9375rem;height:2.5rem}.btn--primary{color:var(--color-button-primary);background-color:var(--color-button-primary-bg);border-color:transparent;font-weight:600}.btn--primary:hover:not(:disabled){background-color:var(--color-button-primary-bg-hover);border-color:transparent;color:var(--color-button-primary-hover)}.btn--secondary{color:var(--color-text-secondary);background-color:transparent;border-color:var(--color-border)}.btn--secondary:hover:not(:disabled){background-color:var(--color-bg-tertiary);border-color:var(--color-border-focus);color:var(--color-border-focus)}.btn--danger{color:var(--color-text-secondary);background-color:transparent;border-color:var(--color-border)}.btn--danger:hover:not(:disabled){background-color:var(--color-signal-bg);border-color:var(--color-signal-text);color:var(--color-signal-text)}.btn--icon-only{width:2rem;height:2rem;padding:0}.btn--icon-only.btn--sm{width:1.75rem;height:1.75rem}.btn--icon-only.btn--lg{width:2.5rem;height:2.5rem}.btn--with-icon-rotate:hover:not(:disabled) .icon{transform:rotate(180deg)}.btn--ghost{color:var(--color-text-secondary);background-color:transparent;border-color:transparent}.btn--ghost:hover:not(:disabled){color:var(--color-text-primary);background-color:var(--color-bg-secondary)}.btn-group{display:flex;gap:.5rem;align-items:center}.btn-group .btn{margin:0}.btn--loading{position:relative;color:transparent;pointer-events:none}.btn--loading:after{content:"";position:absolute;width:1rem;height:1rem;border:2px solid currentColor;border-radius:50%;border-top-color:transparent;animation:btn-spin .6s linear infinite;color:var(--color-text-primary)}.btn--primary.btn--loading:after{color:#fff}@keyframes btn-spin{to{transform:rotate(360deg)}}.btn--full-width{width:100%}.btn--compact{padding-left:.5rem;padding-right:.5rem}
