.converter-tabs{display:flex;gap:12px;margin-bottom:24px;border-bottom:1px solid var(--gray-200);padding-bottom:12px}.conv-tab{background:transparent;border:none;padding:8px 24px;font-size:1rem;cursor:pointer;transition:var(--transition);color:var(--gray-600);border-radius:var(--border-radius-md)}.conv-tab.active{background:var(--primary-color);color:white;box-shadow:0 2px 8px rgba(59,130,246,0.3)}.input-row{display:flex;align-items:center;gap:16px;margin-bottom:20px;flex-wrap:wrap}.input-row label{font-weight:600;color:var(--gray-700);min-width:80px}.input-row .input-field{flex:1;max-width:400px}.results-row{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:20px}.result-box{background:var(--gray-50);border-radius:var(--border-radius-lg);padding:16px;border:1px solid var(--gray-200)}.hex-value{font-family:monospace;font-size:1rem;font-weight:600;color:var(--primary-color);margin:12px 0;word-break:break-all}.result-display{background:var(--gray-50);border-radius:var(--border-radius-md);padding:16px;font-family:monospace;font-size:1rem;color:var(--gray-800);margin-top:8px}.copy-hex{background:transparent;border:1px solid var(--gray-300);padding:4px 12px;border-radius:var(--border-radius-sm);cursor:pointer;transition:var(--transition)}.copy-hex:hover{background:var(--gray-200);color:var(--primary-color)}@media (max-width:768px){.results-row{grid-template-columns:1fr}}