.card.svelte-grkijw{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}.card.svelte-grkijw .card-header:where(.svelte-grkijw) h1:where(.svelte-grkijw){color:var(--text-primary);font-size:var(--font-size-2xl);font-weight:700;margin:0}.card.svelte-grkijw .card-header:where(.svelte-grkijw) p:where(.svelte-grkijw){color:var(--text-secondary);margin:var(--spacing-xs) 0 0}.examples-section.svelte-grkijw{margin-bottom:var(--spacing-lg);background:var(--bg-tertiary);border-radius:var(--radius-md);border:1px solid var(--border-primary)}.examples-section.svelte-grkijw summary:where(.svelte-grkijw){display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-md) var(--spacing-sm);border-radius:var(--radius-md);cursor:pointer;color:var(--text-primary);font-weight:600;transition:var(--transition-fast)}.examples-section.svelte-grkijw summary:where(.svelte-grkijw):hover{background:var(--surface-hover)}.examples-section.svelte-grkijw summary:where(.svelte-grkijw) .chevron:where(.svelte-grkijw){width:16px;height:16px;transition:transform var(--transition-fast)}.examples-section[open].svelte-grkijw summary:where(.svelte-grkijw) .chevron:where(.svelte-grkijw){transform:rotate(180deg)}.examples-section.svelte-grkijw .examples-grid:where(.svelte-grkijw){display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--spacing-sm);padding:var(--spacing-md);border-radius:0 0 var(--radius-md) var(--radius-md)}.examples-section.svelte-grkijw .example-btn:where(.svelte-grkijw){text-align:left;padding:var(--spacing-sm);border:none;border:1px solid var(--border-primary);border-radius:var(--radius-sm);transition:var(--transition-fast);cursor:pointer}.examples-section.svelte-grkijw .example-btn:where(.svelte-grkijw):hover{border-color:var(--color-primary)}.examples-section.svelte-grkijw .example-btn:where(.svelte-grkijw) .example-name:where(.svelte-grkijw){font-weight:600;margin-bottom:var(--spacing-xs)}.examples-section.svelte-grkijw .example-btn:where(.svelte-grkijw) .example-desc:where(.svelte-grkijw){font-size:var(--font-size-xs);opacity:.9}.form-grid.svelte-grkijw{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-xl)}@media (max-width: 768px){.form-grid.svelte-grkijw{grid-template-columns:1fr;gap:var(--spacing-lg)}}.input-section.svelte-grkijw{display:flex;flex-direction:column;gap:var(--spacing-md)}.input-section.svelte-grkijw .field-group:where(.svelte-grkijw) label:where(.svelte-grkijw){display:block;color:var(--text-primary);font-weight:500;margin-bottom:var(--spacing-xs);cursor:help}.input-section.svelte-grkijw .field-group:where(.svelte-grkijw) input:where(.svelte-grkijw){width:100%;padding:var(--spacing-sm);background:var(--bg-primary);border:1px solid var(--border-primary);border-radius:var(--radius-md);color:var(--text-primary);transition:var(--transition-fast)}.input-section.svelte-grkijw .field-group:where(.svelte-grkijw) input:where(.svelte-grkijw):focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px var(--color-primary-dark)}.input-section.svelte-grkijw .field-group:where(.svelte-grkijw) .mono-input:where(.svelte-grkijw){font-family:var(--font-mono);font-size:var(--font-size-sm)}.input-section.svelte-grkijw .field-group:where(.svelte-grkijw) small:where(.svelte-grkijw){color:var(--text-secondary);font-size:var(--font-size-xs);margin-top:var(--spacing-xs);display:block}.input-section.svelte-grkijw .field-group:where(.svelte-grkijw) .email-preview:where(.svelte-grkijw){display:flex;align-items:center;gap:var(--spacing-xs);color:var(--color-info);font-size:var(--font-size-xs);margin-top:var(--spacing-xs)}.converter-section.svelte-grkijw{padding:var(--spacing-sm);background:color-mix(in srgb,var(--color-success) 8%,transparent);border:1px solid var(--color-success);border-radius:var(--radius-md)}.converter-section.svelte-grkijw h4:where(.svelte-grkijw){color:var(--color-success);font-weight:600;margin:0 0 var(--spacing-sm)}.converter-section.svelte-grkijw .converter-input:where(.svelte-grkijw){display:flex;gap:var(--spacing-sm)}.converter-section.svelte-grkijw .converter-input:where(.svelte-grkijw) input:where(.svelte-grkijw){flex:1;padding:var(--spacing-xs);border:1px solid var(--color-success);border-radius:var(--radius-sm);background:var(--bg-primary);color:var(--text-primary)}.converter-section.svelte-grkijw .converter-input:where(.svelte-grkijw) input:where(.svelte-grkijw):focus{outline:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--color-success),transparent 80%)}.converter-section.svelte-grkijw small:where(.svelte-grkijw){color:var(--color-success);font-size:var(--font-size-xs);margin-top:var(--spacing-xs);display:block}.output-section.svelte-grkijw{display:flex;flex-direction:column;gap:var(--spacing-md)}.output-section.svelte-grkijw .output-group:where(.svelte-grkijw) .code-output:where(.svelte-grkijw){padding:var(--spacing-md);background:var(--bg-tertiary);border:1px solid var(--border-primary);border-radius:var(--radius-md)}.output-section.svelte-grkijw .output-group:where(.svelte-grkijw) .code-output:where(.svelte-grkijw) pre:where(.svelte-grkijw){font-family:var(--font-mono);font-size:var(--font-size-sm);color:var(--text-primary);white-space:pre-wrap;word-break:break-all;margin:0}.output-section.svelte-grkijw .output-group:where(.svelte-grkijw) .code-output:where(.svelte-grkijw) .placeholder-text:where(.svelte-grkijw){color:var(--text-secondary);font-size:var(--font-size-sm);margin:0}.output-section.svelte-grkijw .output-group:where(.svelte-grkijw) .code-output:where(.svelte-grkijw) small:where(.svelte-grkijw){color:var(--text-secondary);font-size:var(--font-size-xs);margin-top:var(--spacing-sm);display:block}.output-section.svelte-grkijw .output-group:where(.svelte-grkijw) .txt-output:where(.svelte-grkijw){background:color-mix(in srgb,var(--color-info) 8%,transparent);border-color:var(--color-info)}.output-section.svelte-grkijw .output-group:where(.svelte-grkijw) .txt-output:where(.svelte-grkijw) pre:where(.svelte-grkijw){color:var(--color-info)}.output-section.svelte-grkijw .output-group:where(.svelte-grkijw) .txt-output:where(.svelte-grkijw) small:where(.svelte-grkijw){color:var(--color-info)}.alert.svelte-grkijw{padding:var(--spacing-sm);border-radius:var(--radius-md);margin-bottom:var(--spacing-md)}.alert.svelte-grkijw h4:where(.svelte-grkijw){font-weight:600;margin:0 0 var(--spacing-xs)}.alert.svelte-grkijw ul:where(.svelte-grkijw){margin:0;padding-left:var(--spacing-md)}.alert.svelte-grkijw ul:where(.svelte-grkijw) li:where(.svelte-grkijw){margin-bottom:var(--spacing-xs)}.alert.alert-info.svelte-grkijw{background:color-mix(in srgb,var(--color-info) 8%,transparent);border:1px solid var(--color-info);color:var(--color-info)}.alert.alert-warning.svelte-grkijw{background:color-mix(in srgb,var(--color-warning) 8%,transparent);border:1px solid var(--color-warning);color:var(--color-warning)}.button-group.svelte-grkijw{display:flex;gap:var(--spacing-sm)}@media (max-width: 480px){.button-group.svelte-grkijw{flex-direction:column}}.btn-secondary.svelte-grkijw{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-primary);border-radius:var(--radius-md);cursor:pointer;transition:var(--transition-fast)}.btn-secondary.svelte-grkijw:hover{background:var(--surface-hover)}.btn-secondary.svelte-grkijw:focus{outline:none;box-shadow:0 0 0 2px var(--color-primary-dark)}.btn-secondary.success.svelte-grkijw{border-color:var(--color-success);color:var(--color-success)}.btn-primary.svelte-grkijw{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);background:var(--color-primary);color:var(--bg-primary);border:none;border-radius:var(--radius-md);cursor:pointer;transition:var(--transition-fast)}.btn-primary.svelte-grkijw:hover{background:var(--color-primary);color:var(--bg-primary)}.btn-primary.svelte-grkijw:focus{outline:none;box-shadow:0 0 0 2px var(--color-primary-dark)}.btn-primary.success.svelte-grkijw{background:color-mix(in srgb,var(--color-success) 8%,transparent)}.btn-primary.success.svelte-grkijw:hover{background:var(--color-success-light)}.btn-success.svelte-grkijw{padding:var(--spacing-xs) var(--spacing-sm);background:color-mix(in srgb,var(--color-success) 8%,transparent);color:var(--text-primary);border:none;border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition-fast)}.btn-success.svelte-grkijw:hover:not(:disabled){background:var(--color-success-light)}.btn-success.svelte-grkijw:disabled{opacity:.5;cursor:not-allowed}.info-section.svelte-grkijw{margin-top:var(--spacing-xl)}.info-section.svelte-grkijw .info-card:where(.svelte-grkijw){background:var(--bg-secondary);border:1px solid var(--border-primary);margin-bottom:var(--spacing-lg);flex-direction:column;align-items:baseline}.info-section.svelte-grkijw .info-card:where(.svelte-grkijw) h4:where(.svelte-grkijw){color:var(--text-primary);font-weight:600;margin:0 0 var(--spacing-sm)}.info-section.svelte-grkijw .info-card:where(.svelte-grkijw) p:where(.svelte-grkijw){color:var(--text-primary);line-height:1.6;margin:0}.info-section.svelte-grkijw .info-grid:where(.svelte-grkijw){display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--spacing-md);margin-bottom:var(--spacing-lg)}.info-section.svelte-grkijw .info-grid:where(.svelte-grkijw) .card:where(.svelte-grkijw){background:var(--bg-secondary);border:1px solid var(--border-primary)}.info-section.svelte-grkijw .info-grid:where(.svelte-grkijw) .card:where(.svelte-grkijw) h4:where(.svelte-grkijw){color:var(--text-primary);font-weight:600;margin:0 0 var(--spacing-sm)}.info-section.svelte-grkijw .info-grid:where(.svelte-grkijw) .card:where(.svelte-grkijw) .encoding-examples:where(.svelte-grkijw) p:where(.svelte-grkijw){color:var(--text-secondary);margin-bottom:var(--spacing-sm)}.info-section.svelte-grkijw .info-grid:where(.svelte-grkijw) .card:where(.svelte-grkijw) .encoding-examples:where(.svelte-grkijw) .code-example:where(.svelte-grkijw){padding:var(--spacing-xs);background:var(--bg-primary);border:1px solid var(--border-secondary);border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:var(--font-size-xs);margin-bottom:var(--spacing-xs)}.info-section.svelte-grkijw .info-grid:where(.svelte-grkijw) .card:where(.svelte-grkijw) .encoding-examples:where(.svelte-grkijw) .code-example:where(.svelte-grkijw) div:where(.svelte-grkijw){color:var(--text-primary)}.info-section.svelte-grkijw .info-grid:where(.svelte-grkijw) .card:where(.svelte-grkijw) .encoding-examples:where(.svelte-grkijw) small:where(.svelte-grkijw){color:var(--text-secondary);font-size:var(--font-size-xs)}.info-section.svelte-grkijw .info-grid:where(.svelte-grkijw) .card:where(.svelte-grkijw) .use-cases:where(.svelte-grkijw){margin:0;padding-left:var(--spacing-md)}.info-section.svelte-grkijw .info-grid:where(.svelte-grkijw) .card:where(.svelte-grkijw) .use-cases:where(.svelte-grkijw) li:where(.svelte-grkijw){color:var(--text-secondary);margin-bottom:var(--spacing-xs);position:relative}.info-section.svelte-grkijw .info-grid:where(.svelte-grkijw) .card:where(.svelte-grkijw) .use-cases:where(.svelte-grkijw) li:where(.svelte-grkijw)::marker{color:var(--color-primary)}.info-section.svelte-grkijw .best-practices-card:where(.svelte-grkijw){background:var(--bg-secondary);border:1px solid var(--border-primary)}.info-section.svelte-grkijw .best-practices-card:where(.svelte-grkijw) h4:where(.svelte-grkijw){color:var(--text-primary);font-weight:600;margin:0 0 var(--spacing-sm)}.info-section.svelte-grkijw .best-practices-card:where(.svelte-grkijw) .best-practices:where(.svelte-grkijw){margin:0;padding-left:var(--spacing-md)}.info-section.svelte-grkijw .best-practices-card:where(.svelte-grkijw) .best-practices:where(.svelte-grkijw) li:where(.svelte-grkijw){color:var(--text-primary);margin-bottom:var(--spacing-xs)}.info-section.svelte-grkijw .best-practices-card:where(.svelte-grkijw) .best-practices:where(.svelte-grkijw) li:where(.svelte-grkijw)::marker{color:var(--color-primary)}
