.idn-converter.svelte-2q20du{max-width:1400px;margin:0 auto;padding:var(--spacing-lg)}@media (max-width: 768px){.idn-converter.svelte-2q20du{padding:var(--spacing-md)}}.card.svelte-2q20du{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}.card.svelte-2q20du .card-header:where(.svelte-2q20du) h1:where(.svelte-2q20du){color:var(--text-primary);font-size:var(--font-size-2xl);font-weight:700;margin:0}.card.svelte-2q20du .card-header:where(.svelte-2q20du) p:where(.svelte-2q20du){color:var(--text-secondary);margin:var(--spacing-xs) 0 0}.mode-toggle.svelte-2q20du{margin-bottom:var(--spacing-lg)}.mode-toggle.svelte-2q20du .toggle-container:where(.svelte-2q20du){display:flex;justify-content:center;background:var(--bg-tertiary);padding:var(--spacing-xs);border-radius:var(--radius-lg);border:1px solid var(--border-primary)}.mode-toggle.svelte-2q20du .toggle-container:where(.svelte-2q20du) .toggle-btn:where(.svelte-2q20du){display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);background:transparent;color:var(--text-secondary);border:none;border-radius:var(--radius-md);cursor:pointer;transition:var(--transition-fast);font-size:var(--font-size-sm)}.mode-toggle.svelte-2q20du .toggle-container:where(.svelte-2q20du) .toggle-btn.active:where(.svelte-2q20du){background:var(--bg-secondary);color:var(--text-primary);box-shadow:var(--shadow-sm)}.mode-toggle.svelte-2q20du .toggle-container:where(.svelte-2q20du) .toggle-btn:where(.svelte-2q20du):hover:not(.active){background:var(--surface-hover)}.examples-section.svelte-2q20du{margin-bottom:var(--spacing-lg);background:var(--bg-tertiary);border-radius:var(--radius-md);border:1px solid var(--border-primary)}.examples-section.svelte-2q20du summary:where(.svelte-2q20du){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-2q20du summary:where(.svelte-2q20du):hover{background:var(--surface-hover)}.examples-section.svelte-2q20du summary:where(.svelte-2q20du) .summary-content:where(.svelte-2q20du){display:flex;align-items:center;gap:var(--spacing-sm);color:var(--color-primary);font-weight:600}.examples-section.svelte-2q20du summary:where(.svelte-2q20du) .chevron:where(.svelte-2q20du){width:16px;height:16px;transition:transform var(--transition-fast)}.examples-section[open].svelte-2q20du summary:where(.svelte-2q20du) .chevron:where(.svelte-2q20du){transform:rotate(180deg)}.examples-section.svelte-2q20du .examples-grid:where(.svelte-2q20du){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-2q20du .example-btn:where(.svelte-2q20du){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-2q20du .example-btn:where(.svelte-2q20du):hover{border-color:var(--color-primary)}.examples-section.svelte-2q20du .example-btn:where(.svelte-2q20du) .example-domain:where(.svelte-2q20du){font-weight:600;font-family:var(--font-mono);margin-bottom:var(--spacing-xs)}.examples-section.svelte-2q20du .example-btn:where(.svelte-2q20du) .example-desc:where(.svelte-2q20du){font-size:var(--font-size-xs);opacity:.9}.conversion-card.svelte-2q20du{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);margin-bottom:var(--spacing-lg)}.conversion-card.svelte-2q20du .conversion-header:where(.svelte-2q20du){border-bottom:1px solid var(--border-primary);padding:var(--spacing-lg)}.conversion-card.svelte-2q20du .conversion-header:where(.svelte-2q20du) h2:where(.svelte-2q20du){color:var(--text-primary);font-size:var(--font-size-lg);font-weight:600;margin:0}.conversion-card.svelte-2q20du .conversion-grid:where(.svelte-2q20du){display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-xl);padding:var(--spacing-lg)}@media (max-width: 768px){.conversion-card.svelte-2q20du .conversion-grid:where(.svelte-2q20du){grid-template-columns:1fr;gap:var(--spacing-lg)}}.input-card.svelte-2q20du{background:var(--bg-tertiary);border:1px solid var(--border-primary);border-radius:var(--radius-md);padding:var(--spacing-md)}.input-card.svelte-2q20du .input-section:where(.svelte-2q20du) label:where(.svelte-2q20du){display:block;color:var(--text-primary);font-weight:500;margin-bottom:var(--spacing-sm);cursor:help}.input-card.svelte-2q20du .input-section:where(.svelte-2q20du) textarea:where(.svelte-2q20du){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);resize:vertical;transition:var(--transition-fast)}.input-card.svelte-2q20du .input-section:where(.svelte-2q20du) textarea:where(.svelte-2q20du):focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px var(--color-primary-dark)}.input-card.svelte-2q20du .input-section:where(.svelte-2q20du) textarea.mono-font:where(.svelte-2q20du){font-family:var(--font-mono)}.input-card.svelte-2q20du .input-section:where(.svelte-2q20du) small:where(.svelte-2q20du){color:var(--text-secondary);font-size:var(--font-size-xs);margin-top:var(--spacing-sm);display:block}.output-card.svelte-2q20du{background:var(--bg-tertiary);border:1px solid var(--border-primary);border-radius:var(--radius-md);padding:var(--spacing-md)}.output-card.svelte-2q20du .output-section:where(.svelte-2q20du){display:flex;flex-direction:column;gap:var(--spacing-md)}.output-card.svelte-2q20du .output-section:where(.svelte-2q20du) .output-header:where(.svelte-2q20du){display:flex;align-items:center;justify-content:space-between}.output-card.svelte-2q20du .output-section:where(.svelte-2q20du) .output-header:where(.svelte-2q20du) .swap-btn:where(.svelte-2q20du){display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);background:transparent;color:var(--color-primary);border:1px solid var(--color-primary);border-radius:var(--radius-sm);cursor:pointer;font-size:var(--font-size-xs);transition:var(--transition-fast)}.output-card.svelte-2q20du .output-section:where(.svelte-2q20du) .output-header:where(.svelte-2q20du) .swap-btn:where(.svelte-2q20du):hover{background:var(--color-primary);color:var(--bg-primary)}.output-card.svelte-2q20du .output-section:where(.svelte-2q20du) .output-header:where(.svelte-2q20du) .swap-btn:where(.svelte-2q20du) svg:where(.svelte-2q20du){width:12px;height:12px}.output-card.svelte-2q20du .output-section:where(.svelte-2q20du) .output-display:where(.svelte-2q20du){background:var(--bg-primary);border:1px solid var(--border-primary);border-radius:var(--radius-md);padding:var(--spacing-md);min-height:100px}.output-card.svelte-2q20du .output-section:where(.svelte-2q20du) .output-display:where(.svelte-2q20du) .result-text:where(.svelte-2q20du){color:var(--text-primary);font-size:var(--font-size-sm);white-space:pre-wrap;word-break:break-all;margin:0}.output-card.svelte-2q20du .output-section:where(.svelte-2q20du) .output-display:where(.svelte-2q20du) .result-text.mono-font:where(.svelte-2q20du){font-family:var(--font-mono)}.output-card.svelte-2q20du .output-section:where(.svelte-2q20du) .output-display:where(.svelte-2q20du) .error-text:where(.svelte-2q20du){color:var(--color-error);font-size:var(--font-size-sm);margin:0}.output-card.svelte-2q20du .output-section:where(.svelte-2q20du) .output-display:where(.svelte-2q20du) .placeholder-text:where(.svelte-2q20du){color:var(--text-secondary);font-size:var(--font-size-sm);margin:0}.alert.svelte-2q20du{padding:var(--spacing-sm);border-radius:var(--radius-md);margin-bottom:var(--spacing-md)}.alert.svelte-2q20du h4:where(.svelte-2q20du){font-weight:600;margin:0 0 var(--spacing-xs)}.alert.svelte-2q20du ul:where(.svelte-2q20du){margin:0;padding-left:var(--spacing-md)}.alert.svelte-2q20du ul:where(.svelte-2q20du) li:where(.svelte-2q20du){margin-bottom:var(--spacing-xs)}.alert.alert-warning.svelte-2q20du{background:var(--color-warning-light);border:1px solid var(--color-warning);color:var(--color-warning)}.button-group.svelte-2q20du{display:flex;gap:var(--spacing-sm)}@media (max-width: 480px){.button-group.svelte-2q20du{flex-direction:column}}.btn-secondary.svelte-2q20du{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-2q20du:hover{background:var(--surface-hover)}.btn-secondary.svelte-2q20du:focus{outline:none;box-shadow:0 0 0 2px var(--color-primary-dark)}.btn-secondary.success.svelte-2q20du{background:var(--color-success-light);border-color:var(--color-success);color:var(--color-success)}.btn-primary.svelte-2q20du{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);background:var(--color-primary-dark);color:#fff;border:none;border-radius:var(--radius-md);cursor:pointer;transition:var(--transition-fast)}.btn-primary.svelte-2q20du:hover{background:var(--color-primary);color:var(--bg-primary)}.btn-primary.svelte-2q20du:focus{outline:none;box-shadow:0 0 0 2px var(--color-primary-dark)}.btn-primary.success.svelte-2q20du{background:var(--color-success)}.btn-primary.success.svelte-2q20du:hover{background:var(--color-success-light)}.info-section.svelte-2q20du .info-card:where(.svelte-2q20du){background:color-mix(in srgb,var(--color-info-light) 8%,transparent);border-color:var(--color-info);margin-bottom:var(--spacing-lg);flex-direction:column;align-items:flex-start}.info-section.svelte-2q20du .info-card:where(.svelte-2q20du) h3:where(.svelte-2q20du){color:var(--color-info);font-size:var(--font-size-md)}.info-section.svelte-2q20du .info-card:where(.svelte-2q20du) p:where(.svelte-2q20du){color:var(--text-primary);line-height:1.6;margin:0}.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du){display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:var(--spacing-md);margin-bottom:var(--spacing-lg)}.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du) .card:where(.svelte-2q20du) h4:where(.svelte-2q20du){color:var(--text-primary);font-weight:600;margin:0 0 var(--spacing-sm)}.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du) .card:where(.svelte-2q20du) .punycode-example:where(.svelte-2q20du) p:where(.svelte-2q20du){color:var(--text-secondary);margin-bottom:var(--spacing-sm)}.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du) .card:where(.svelte-2q20du) .punycode-example:where(.svelte-2q20du) .code-example:where(.svelte-2q20du){padding:var(--spacing-sm);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-sm)}.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du) .card:where(.svelte-2q20du) .punycode-example:where(.svelte-2q20du) .code-example:where(.svelte-2q20du) div:where(.svelte-2q20du){color:var(--text-primary);margin-bottom:var(--spacing-xs)}.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du) .card:where(.svelte-2q20du) .punycode-example:where(.svelte-2q20du) .code-example:where(.svelte-2q20du) div:where(.svelte-2q20du) strong:where(.svelte-2q20du){color:var(--text-primary)}.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du) .card:where(.svelte-2q20du) .punycode-example:where(.svelte-2q20du) .code-example:where(.svelte-2q20du) .unicode-text:where(.svelte-2q20du){color:var(--color-primary)}.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du) .card:where(.svelte-2q20du) .punycode-example:where(.svelte-2q20du) .code-example:where(.svelte-2q20du) .encoded-text:where(.svelte-2q20du){color:var(--color-purple)}.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du) .card:where(.svelte-2q20du) .punycode-example:where(.svelte-2q20du) .code-example:where(.svelte-2q20du) .final-text:where(.svelte-2q20du){color:var(--color-success)}.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du) .card:where(.svelte-2q20du) .punycode-example:where(.svelte-2q20du) small:where(.svelte-2q20du){color:var(--text-secondary);font-size:var(--font-size-xs)}.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du) .card:where(.svelte-2q20du) .punycode-example:where(.svelte-2q20du) small:where(.svelte-2q20du) code:where(.svelte-2q20du){background:var(--bg-tertiary);padding:2px var(--spacing-xs);border-radius:var(--radius-xs);font-size:var(--font-size-xs)}.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du) .card:where(.svelte-2q20du) .use-cases:where(.svelte-2q20du),.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du) .card:where(.svelte-2q20du) .features:where(.svelte-2q20du),.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du) .card:where(.svelte-2q20du) .security-list:where(.svelte-2q20du){margin:0;padding-left:var(--spacing-md)}.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du) .card:where(.svelte-2q20du) .use-cases:where(.svelte-2q20du) li:where(.svelte-2q20du),.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du) .card:where(.svelte-2q20du) .features:where(.svelte-2q20du) li:where(.svelte-2q20du),.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du) .card:where(.svelte-2q20du) .security-list:where(.svelte-2q20du) li:where(.svelte-2q20du){color:var(--text-secondary);margin-bottom:var(--spacing-xs)}.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du) .card:where(.svelte-2q20du) .use-cases:where(.svelte-2q20du) li:where(.svelte-2q20du)::marker,.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du) .card:where(.svelte-2q20du) .features:where(.svelte-2q20du) li:where(.svelte-2q20du)::marker,.info-section.svelte-2q20du .info-grid:where(.svelte-2q20du) .card:where(.svelte-2q20du) .security-list:where(.svelte-2q20du) li:where(.svelte-2q20du)::marker{color:var(--color-success)}.info-section.svelte-2q20du .security-card:where(.svelte-2q20du) .security-list:where(.svelte-2q20du) li:where(.svelte-2q20du)::marker{color:var(--color-warning)!important}