.base32-encoder{max-width:900px;margin:0 auto;padding:2rem;font-family:system-ui,-apple-system,sans-serif}.base32-encoder h1{color:#333;text-align:center;margin-bottom:2rem}.base32-encoder .encoder-container{display:flex;flex-direction:column;gap:1.5rem}@media(min-width:768px){.base32-encoder .encoder-container{flex-direction:row}}.base32-encoder .input-section,.base32-encoder .output-section{flex:1;display:flex;flex-direction:column}.base32-encoder label{font-weight:500;margin-bottom:.5rem;display:block}.base32-encoder textarea{width:100%;padding:.75rem;border:1px solid #ccc;border-radius:4px;font-family:monospace;font-size:1rem;line-height:1.5;margin-bottom:1rem;resize:vertical}.base32-encoder textarea:focus{outline:none;border-color:#4299e1;box-shadow:0 0 0 3px rgba(66,153,225,.2)}.base32-encoder .copy-button{background-color:#4299e1;color:#fff;border:none;padding:.5rem 1rem;border-radius:4px;font-weight:500;cursor:pointer;align-self:flex-start;transition:background-color .2s}.base32-encoder .copy-button:hover{background-color:#3182ce}.base32-encoder .copy-button:disabled{background-color:#a0aec0;cursor:not-allowed}.base32-encoder .error-message{margin-top:1rem;padding:.75rem;border-radius:4px;background-color:#fed7d7;color:#c53030}.base32-encoder .error-message:empty{display:none}.base32-encoder .info-section{margin-top:3rem;padding-top:1.5rem;border-top:1px solid #e2e8f0}.base32-encoder .info-section h2{font-size:1.25rem;margin-bottom:1rem}.base32-encoder .info-section p{margin-bottom:1rem;line-height:1.6}