.url-decoder-container{max-width:1200px;margin:0 auto;padding:2rem 1rem;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;color:#333}.url-decoder-container header{text-align:center;margin-bottom:2rem}.url-decoder-container header h1{font-size:2.5rem;margin-bottom:.5rem;color:#2563eb}@media(max-width:768px){.url-decoder-container header h1{font-size:2rem}}@media(max-width:480px){.url-decoder-container header h1{font-size:1.5rem}}.url-decoder-container header p{font-size:1.1rem;color:#666;max-width:800px;margin:0 auto}@media(max-width:768px){.url-decoder-container header p{font-size:1rem}}.url-decoder-container main{display:flex;flex-direction:column;gap:1.5rem}.url-decoder-container .input-section,.url-decoder-container .output-section{display:flex;flex-direction:column;gap:.5rem}.url-decoder-container label{font-weight:700;font-size:1.1rem;color:#1e40af}.url-decoder-container textarea{width:100%;padding:1rem;border:2px solid #e2e8f0;border-radius:.5rem;font-size:1rem;font-family:monospace;resize:vertical;transition:border-color .2s ease}.url-decoder-container textarea:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.2)}.url-decoder-container .error-message{display:flex;align-items:center;gap:.5rem;color:#ef4444;font-size:.9rem;margin-top:.5rem;padding:.5rem;background-color:rgba(239,68,68,.1);border-radius:.25rem}.url-decoder-container .button-group{display:flex;justify-content:flex-end;gap:1rem}.url-decoder-container button{padding:.75rem 1.5rem;border:none;border-radius:.5rem;font-weight:700;cursor:pointer;transition:all .2s ease}.url-decoder-container button:disabled{opacity:.5;cursor:not-allowed}@media(max-width:480px){.url-decoder-container button{padding:.5rem 1rem}}.url-decoder-container .clear-button{background-color:#f3f4f6;color:#4b5563}.url-decoder-container .clear-button:hover:not(:disabled){background-color:#e5e7eb}.url-decoder-container .output-container{position:relative;width:100%}.url-decoder-container .copy-button{position:absolute;top:.5rem;right:.5rem;padding:.5rem;background-color:#f3f4f6;border-radius:.25rem;display:flex;align-items:center;justify-content:center}.url-decoder-container .copy-button:hover:not(:disabled){background-color:#e5e7eb}.url-decoder-container .copy-button.copied{background-color:#10b981;color:#fff}.url-decoder-container .info-section{margin-top:2rem;padding:1.5rem;background-color:#f8fafc;border-radius:.5rem;border:1px solid #e2e8f0}.url-decoder-container .info-section h2{font-size:1.5rem;margin-bottom:1rem;color:#1e40af}.url-decoder-container .info-section h3{font-size:1.2rem;margin:1rem 0 .5rem;color:#1e40af}.url-decoder-container .info-section ul{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.5rem;list-style-type:none;padding:0;margin:.5rem 0 0}@media(max-width:480px){.url-decoder-container .info-section ul{grid-template-columns:repeat(2,1fr)}}.url-decoder-container .info-section li{display:flex;align-items:center;gap:.5rem}.url-decoder-container .info-section code{background-color:#e2e8f0;padding:.25rem .5rem;border-radius:.25rem;font-family:monospace}.url-decoder-container footer{margin-top:3rem;text-align:center;font-size:.9rem;color:#6b7280}@media(prefers-color-scheme:dark){.url-decoder-container{color:#e5e7eb}.url-decoder-container header h1{color:#3b82f6}.url-decoder-container header p{color:#9ca3af}.url-decoder-container label{color:#60a5fa}.url-decoder-container textarea{background-color:#1f2937;border-color:#374151;color:#e5e7eb}.url-decoder-container textarea:focus{border-color:#3b82f6}.url-decoder-container .error-message{background-color:rgba(239,68,68,.2)}.url-decoder-container .clear-button{background-color:#374151;color:#e5e7eb}.url-decoder-container .clear-button:hover:not(:disabled){background-color:#4b5563}.url-decoder-container .copy-button{background-color:#374151;color:#e5e7eb}.url-decoder-container .copy-button:hover:not(:disabled){background-color:#4b5563}.url-decoder-container .info-section{background-color:#1f2937;border-color:#374151}.url-decoder-container .info-section h2,.url-decoder-container .info-section h3{color:#60a5fa}.url-decoder-container .info-section code{background-color:#374151;color:#e5e7eb}.url-decoder-container footer{color:#9ca3af}}