.url-tool{display:flex;flex-direction:column;gap:1.5rem;width:100%;max-width:1000px;margin:0 auto}.controls{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem}.mode-selector{display:flex;gap:1.5rem}.mode-selector label{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:6px;cursor:pointer;transition:background-color .2s}.mode-selector label:hover{background-color:#f6f8fa}.mode-selector label.active{background-color:#f1f8ff;border:1px solid #c8e1ff}.mode-selector input[type=radio]{margin:0}.component-selector select{padding:.5rem;border:1px solid #e1e4e8;border-radius:6px;font-size:1rem;background-color:white}.error-message{padding:.75rem 1rem;border-radius:6px;background-color:#ffebe9;color:#cf222e;border:1px solid #ff9999}.side-by-side{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.input-column,.output-column{display:flex;flex-direction:column;gap:.5rem}.url-tool h3{margin:0;font-size:1rem;color:#586069}.url-tool textarea{width:100%;height:200px;padding:1rem;border:1px solid #e1e4e8;border-radius:6px;font-family:inherit;font-size:1rem;line-height:1.5;resize:vertical}.output-column textarea{background-color:#f6f8fa;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace}.button-group{display:flex;gap:1rem;flex-wrap:wrap}.clear-button,.convert-button,.copy-button{padding:.75rem 1.25rem;border:none;border-radius:6px;font-size:1rem;font-weight:500;cursor:pointer;transition:background-color .2s}.convert-button{background-color:#2ea44f;color:white}.convert-button:hover{background-color:#2c974b}.clear-button{background-color:#6e7781;color:white}.clear-button:hover{background-color:#57606a}.copy-button{background-color:#0969da;color:white}.copy-button:hover{background-color:#0860c1}@media (max-width:768px){.side-by-side{grid-template-columns:1fr}.controls{flex-direction:column;align-items:flex-start}.mode-selector{width:100%;justify-content:space-between}.url-tool textarea{height:150px}}