.tm-url-encoder-decoder{container-type:inline-size}.tm-url-encoder-decoder__section{margin-bottom:var(--spacing-5)}.tm-url-encoder-decoder__section:last-child{margin-bottom:0}.tm-url-encoder-decoder__section-label{display:block;margin-bottom:var(--spacing-2);font-size:12px;font-weight:600;color:var(--color-text-2);text-transform:uppercase;letter-spacing:.05em}.tm-url-encoder-decoder__option-grid{display:flex;flex-wrap:wrap;gap:var(--spacing-2)}.tm-url-encoder-decoder__controls-hint{margin:0;font-size:13px;line-height:1.5;color:var(--color-text-2)}.tm-url-encoder-decoder__primary{min-height:min(52vh,560px)}.tm-url-encoder-decoder__section--input,.tm-url-encoder-decoder__section--output{display:flex;flex-direction:column;min-height:0}.tm-url-encoder-decoder__section--output{flex:1 1 auto}.tm-url-encoder-decoder__textarea{width:100%;min-height:132px;padding:var(--spacing-3);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg-2);color:var(--color-text-1);font-family:var(--font-mono);font-size:14px;line-height:1.55;resize:vertical}.tm-url-encoder-decoder__textarea:focus-visible{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent-bg)}.tm-url-encoder-decoder__textarea.is-error{border-color:color-mix(in srgb,var(--color-danger) 45%,var(--color-border))}[data-theme=dark] .tm-url-encoder-decoder__textarea{background:var(--color-bg-3)}.tm-url-encoder-decoder__input-meta{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-3);flex-wrap:wrap;margin-top:var(--spacing-2)}.tm-url-encoder-decoder__counter{font-size:12px;color:var(--color-text-2);font-variant-numeric:tabular-nums}.tm-url-encoder-decoder__input-actions{display:flex;gap:var(--spacing-1);flex-wrap:wrap}.tm-url-encoder-decoder__error{margin:0 0 var(--spacing-5);padding:var(--spacing-3);border:1px solid color-mix(in srgb,var(--color-danger) 30%,var(--color-border));border-radius:var(--radius-md);background:color-mix(in srgb,var(--color-danger) 6%,transparent);color:var(--color-danger-text);font-size:13px;line-height:1.6}.tm-url-encoder-decoder__hint{display:flex;align-items:center;gap:var(--spacing-2);margin:0 0 var(--spacing-5);padding:var(--spacing-2) var(--spacing-3);border-radius:var(--radius-md);background:var(--color-accent-bg);color:var(--color-accent-text);font-size:12px;font-weight:500}.tm-url-encoder-decoder__hint button{font:inherit;color:inherit;background:none;border:0;padding:0;text-decoration:underline;cursor:pointer}.tm-url-encoder-decoder__swap-row{display:flex;justify-content:center;margin-bottom:var(--spacing-5)}.tm-url-encoder-decoder__output-head{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-3);flex-wrap:wrap;margin-bottom:var(--spacing-2)}.tm-url-encoder-decoder__output-head .tm-url-encoder-decoder__section-label{margin-bottom:0}.tm-url-encoder-decoder__output{min-height:132px;padding:var(--spacing-3);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-code-bg);color:var(--color-code-text);font-family:var(--font-mono);font-size:14px;line-height:1.55;white-space:pre-wrap;word-break:break-all;user-select:all}.tm-url-encoder-decoder__output.is-empty{color:var(--color-text-2);font-family:var(--font-sans);white-space:normal;user-select:none;display:flex;align-items:center}.tm-url-encoder-decoder__output--text{font-family:var(--font-sans)}.tm-url-encoder-decoder__trust-note{display:flex;align-items:center;gap:var(--spacing-2);margin-top:auto;padding:var(--spacing-2) var(--spacing-3);border-radius:var(--radius-md);background:color-mix(in srgb,var(--color-success) 10%,transparent);color:var(--color-success-text);font-size:12px;font-weight:500}.tm-url-encoder-decoder__trust-note code{font-family:var(--font-mono);font-size:12px;background:color-mix(in srgb,var(--color-success) 10%,transparent);padding:1px 4px;border-radius:4px}@container (max-width: 480px){.tm-url-encoder-decoder__swap-row button{width:100%}}.tm-url-encoder-decoder__plus-toggle{display:flex;align-items:flex-start;gap:10px;min-height:44px;cursor:pointer}.tm-url-encoder-decoder__plus-toggle input{width:18px;height:18px;margin-top:2px;accent-color:var(--color-accent);flex-shrink:0}.tm-url-encoder-decoder__plus-label{display:block;font-size:14px;font-weight:600;color:var(--color-text-1)}.tm-url-encoder-decoder__plus-help{display:block;font-size:13px;color:var(--color-text-2)}