.converter-container{display:flex;flex-direction:column;gap:.6rem;width:100%}.converter-field{display:flex;align-items:center;gap:.5rem;height:50px;width:100%}.converter-label{width:5rem;font-weight:500;padding:6px}.converter-input,.converter-output{height:40px;padding:.6rem;border:1px solid #ddd;border-radius:8px;font-size:1rem;transition:border-color .2s;padding-right:40px;position:relative;width:100%}.converter-input:focus{outline:none;border-color:#4f46e5;box-shadow:0 0 0 2px #4f46e51a}.converter-output-text{color:#8a8a8a;font-weight:600}.placeholder-text{color:#8a8a8a;font-style:italic;font-size:1rem;font-weight:300}.converter-select{padding:.6rem;flex:1;border:1px solid #ddd;border-radius:8px;background-color:#fff;cursor:pointer;transition:border-color .2s}.converter-select:hover{border-color:#4f46e5}.converter-swap-button{flex:1;display:flex;align-items:center;justify-content:center;gap:.8rem;padding:.8rem;background-color:#4f46e5;color:#fff;border:none;border-radius:8px;cursor:pointer;font-weight:700;transition:background-color .2s}.converter-swap-button:hover{background-color:#4338ca}.converter-swap-text{cursor:pointer}.converter-output{background-color:#f5f5f5}.converter-input::-moz-placeholder,.converter-output::-moz-placeholder{color:#999}.converter-input::placeholder,.converter-output::placeholder{color:#999}.converter-input-wrapper,.converter-output-wrapper{position:relative;width:100%}.converter-clear-button,.converter-copy-button{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;padding:0;font-size:1em;color:#666;transition:color .2s}.converter-clear-button:hover,.converter-copy-button:hover{color:#4f46e5}.converter-output::-moz-selection{background-color:#4f46e51a}.converter-output::selection{background-color:#4f46e51a}.examples-list{list-style:none;padding:0;margin:0;border-width:1px;border-left:0px;border-right:0px}.example-item{margin:10px 0;display:flex;justify-content:space-between;align-items:center}.example-name{font-weight:500;margin-right:10px}.example-value-container{position:relative;display:inline-block;padding-right:10px}.example-value{cursor:pointer;padding:4px 8px;border-radius:4px;transition:background-color .2s;font-weight:600}.example-value:hover{background-color:#f5f5f5}.copy-button{position:absolute;right:0;top:50%;transform:translateY(-50%);opacity:0;transition:opacity .2s;background:none;border:none;cursor:pointer;padding:0;color:#666}.example-value-container:hover .copy-button{opacity:1}.copy-button:hover{color:#333}*{margin:0;padding:0;box-sizing:border-box}body,html{height:100%;font-family:sans-serif;background-color:#f9f9f9}.container{max-width:400px;width:100%;margin:0 auto;background-color:#f9f9f9;border-radius:8px;display:flex;flex-direction:column;min-height:100vh}header{text-align:center;margin-bottom:0}.header-text{margin-top:1rem;font-weight:800}footer{text-align:center;margin-top:auto;font-size:.9rem;color:#666}.converter-main{margin-top:1.5rem;display:flex;flex-direction:column;gap:.6rem;width:100%;padding:.6rem;border-radius:8px;border:1px solid #ddd;box-shadow:0 0 12px 2px #8a8a8a40}.main-content{flex:1}.div-links{flex:1;flex-direction:column}.url{font-size:.8rem;font-weight:300;color:#0c006840}